ARTICLE

TextSearch With Overlay Screen(AJAX)

Posted by Mahak Gupta in Articles | AJAX in C# on October 12, 2010

Tags: AJAX, C#, TextSearch, TextSearch With Overlay Screen

In this article you will learn how to use TextSearch With Overlay Screen(AJAX).

Tweet
3014
0

Reader Level: Beginner

I create a code for overlay and TextSeach(ajax)

Step 1:-> In .aspx page:

First create two Textbox in HTML( txtsearch,txtlname (In my case) )  and a ListBox(ListBox1)

Write the Following Code in Head :

<head id="Head1" runat="server">
   
<title>Untitled 
Page</title>

    </script>

    <style type="text/css">
            .black_show{
                  display: none;
                  position: absolute;
                  top: 0%;
                  left: 0%;
                  width: 100%;
                  height: 100%;
                  background-color: black;
                  z-index:1001;
                  -moz-opacity: 0.8;
                  opacity:.90;
                  filter: alpha(opacity=80);
            }
            .white_show {
                  display: none;
                  position: absolute;
                  top: 25%;
                  left: 25%;
                  width: 50%;
                  height: 50%;
                  padding: 16px;
                  -webkit-border-radius:20px;
                  border: 16px solid orange;
                  background-color: white;
                  z-index:1002;
                  overflow: auto;
            }
            .txtname
             {
            border: 5px solid orange;
             }
      </style>
</head>

And the following Code in Body:-

<body>

<div >

<p>

plz click the button to fill the gridview <input id="Button1" type="button" value="Search" onclick="document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'" /></p>

<tr>

</td>

</td>

</td>

</td>

<%--<asp:ImageButton ID="ImageButton1" Height="20px" ImageUrl="~/close_icon.gif"

OnClientClick="close()" />--%>

</td>

</tr>

<tr>

</td>

</td>

</td>

</td>

</td>

</tr>

<tr>

</td>

</td>

</td>

</td>

</td>

</tr>

<tr>

</td>

</td>

</td>

</td>

</td>

</tr>

<tr>

</td>

</td>

</td>

</td>

</td>

</tr>

<tr>

<strong style="color: orange">First Name</strong></td>

</td>

<%--<select id="ListBox1" runat="server" style="display: none; width: 153px;" onchange="dis()"

enableviewstate="false">

<option>Please Select</option>

</select>--%></td>

<div >

 </div>

</td>

</td>

</tr>

<tr>

</td>

</td>

</td>

</td>

</td>

</tr>

<tr>

<strong style="color: orange">Location</strong></td>

</td>

</td>

</td>

</tr>

<tr>

</td>

</td>

</td>

</td>

</td>

</tr>

<tr>

</td>

</td>

<asp:GridView ID="GridView2" runat="server">

</asp:GridView>

</td>

</td>

</td>

</tr>

<tr>

</td>

</td>

</td>

</td>

</td>

</tr>

<tr>

</td>

</td>

</td>

</td>

</tr>

<tr>

</td>

</td>

<asp:Button ID="Submitbttn" runat="server" Text="Submit" OnClick="Submitbttn_Click" BackColor="Orange" BorderColor="White" BorderStyle="Outset" Font-Bold="True" ForeColor="White" />

<asp:Button ID="Closebttn" runat="server" Text="Close" BackColor="Orange" BorderColor="White" BorderStyle="Outset" Font-Bold="True" ForeColor="White" Width="64px" /></td>

</td>

</td>

</tr>

</table>

 <br />

<%--<asp:TextBox ID="txtsearch" onkeyup="showHint()" runat="server" ></asp:TextBox>--%>

</div>

gdfggfhfghd</div>

<asp:GridView ID="GridView1" runat="server" HorizontalAlign="Center">

</asp:GridView>

</div>

</form>

</body>

Step 2:- In .cs page:

Write the following code:-

         protected void Page_Load(object sender, EventArgs e)
        {

            string str1 = "";
            if (Request.QueryString["name"] == "")
            {
                Response.Clear();
                Response.End();

            }

            else if (Request.QueryString["name"] != null)
            {
                Response.Clear();
                string name = Request.QueryString["name"].ToString();
                int len = name.Length;
                ListBox1.Visible = true;

                for (int i = 0; i <= len; i++)
                {
                    string c = name.Substring(i, len);

                    string str = "";

                    str += c;

                    SqlConnection conn1 = new SqlConnection(ConfigurationManager.ConnectionStrings["conn"].ToString());

                    SqlCommand cmd1 = new SqlCommand("select DISTINCT fname from testseach where fname like '" + str
+ "%'", conn1);

                    conn1.Open();
                    SqlDataReader dr;
                    if (txtsearch.Value != null)
                    {
                         dr = cmd1.ExecuteReader();

                        int a = 0;

                        while (dr.Read())
                        {
                            if (str1 == "")
                            {

                                str1 = dr["fname"].ToString();
                            }
                            else
                            {

                                str1 += "," + dr["fname"].ToString();
                            }

                            a = a + 1;

                        }
                        GridView2.DataSource = dr;
                        GridView2.DataBind();
                        dr.Close();
                        conn1.Close();
                        //else
                        //{
                        //    ListBox1.Items.Clear();
                        //}
                        //str1.Remove(len-1,2);
                        Response.Write(str1);
                        Response.End();
                     }
                }

}
}

        protected void ListBox1_SelectedIndexChanged(object sender, EventArgs e)
        {
            //txtsearch.Value = ListBox1.SelectedItem.Text;
        }
        protected void Submitbttn_Click(object sender, EventArgs e)
        {
            SqlConnection conn1 = new SqlConnection(ConfigurationManager.ConnectionStrings["conn"].ToString());
            conn1.Open();
            SqlCommand cmd1 = new SqlCommand("select * from testseach where fname='" + txtsearch.Value + "' or lname='" + txtlname.Value + "'", conn1);
            SqlDataReader dr1;
            dr1 = cmd1.ExecuteReader();
            GridView1.DataSource = dr1;

            GridView1.DataBind();
            conn1.Close();
            txtsearch.Value = "";
            txtlname.Value = "";
        }

This Feature is Sponsored By

DynamicPDF Merger is a developers dream for interacting with any existing PDF documents. Merge, append, split, form fill, flatten stamp and so much more.

Ajax toolkit control with Accordion

Tags: Accordion, AJAX, ajax control, Ajax toolkit control with Accordion
AJAX AutoCompleteExtender

Tags: AJAX, Ajax AutocompleteExtender, ajaxtoolkit, asp.net 2.0, C#

post comment

COMMENT USING

PREMIUM SPONSORS

DynamicPDF Developer Components

DynamicPDF™ product line allows you to dynamically generate PDF documents, merge PDF documents and add new content to existing PDF documents from within your applications.

TRENDING UP

Create Outlook Add-in by MAPI Functionality by Using Visual Studio 2010 Outlook Project Debugging jQuery in ASP.NET How to Enable Sign in as Different User Option in SharePoint 2013 Top 10 HTML5 Interview Questions Find and Delete Duplicate Records From SQL Table Panel Default Button is Not Working For Rad Combobox Custom Paging With GridView in ASP.NET 4.5 Working With Database in HTML5 Extending WinJS ListView With Custom Item Events Encrypt and Decrypt in SQL Server: Part 2

View All

MOST LIKED ARTICLE

WCF Introduction and Contracts - Day 1 Create SSRS Report Using Report Wizard CREATE READ UPDATE and DELETE - CRUD Operation Using LINQ to SQL WCF - Data Contract - Day 4 Factory Design Pattern

Follow @twitterapi

Options	Votes	%
Lenovo	19	13.19
HP	6	4.17
Dell	17	11.81
Toshiba	54	37.50
Acer	43	29.86
Sony	5	3.47
Total	144	100%

In Focus

TextSearch With Overlay Screen(AJAX)

Related Articles


Favorite Computer Manufacturer

Who is your favorite Computer manufacturer?

Lenovo HP Dell Toshiba Acer Sony