AJAX Search using Textbox

Question

0.00/5 (No votes)

See more:

SQL-Server-2005

, +

Dear Sir, This is Sandhya from india. I did my MCA and finally working as a Junior Programmer on .Net Platform.

I have Many Doubts in .Net Platform. Please help me one by one I need to clear it and i want to learn it perfectly.

I have a textbox and a gridview on my page. I need to search the data like Google.

Suppose if i press one letter S from keyboard it must show all the records of S.

and also i need Water mark extender inside Textbox as Search.

Please Please help me this problem and give me complete code.

Thankuuuuuuuuuuuuuuuuuuuuu.

Posted 23-Apr-12 23:00pm

Sandhya Lovely

Add a Solution

5 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

alok.mailbox · Answer 1 · 2012-04-23T23:06:00

Solution 1

Just Google for auto-extender or jquery auto-complete you will find many useful links

ASP.NET Suggester - Auto-complete Control[^]

Posted 23-Apr-12 23:06pm

alok.mailbox

Comments

Sandhya Lovely 24-Apr-12 5:41am

Sir, Iam Unable to Understand. Please please can u post me the Design and code pages.

uspatel · Answer 2 · 2012-04-23T23:07:00

Solution 2

See These links
Ajax AutoComplete extender
Auto Complete TextBox in ASP.Net
http://web2.codeproject.com/Articles/36809/TextBox-Watermark-Using-JavaScript-and-CSS[^]

Posted 23-Apr-12 23:07pm

uspatel

Comments

Sandhya Lovely 24-Apr-12 5:41am

Sir, Iam Unable to Understand. Please please can u post me the Design and code pages.

uspatel 24-Apr-12 8:08am

I think nobody can provide you a complete code here,But they can help you much if you try something and face any problem.
see one more link
http://www.codeproject.com/Articles/201099/AutoComplete-With-DataBase-and-AjaxControlToolkit

Vipin_Arora · Answer 3 · 2012-04-23T23:15:00

Solution 3

Hi Sandhya,
Its very hard and very much time consuming to give the COMPLETE CODE.
But Here I am giving you the Logic For your Search Provider.

For the search provider, You just need to connect with SQL Server and get the data from following command:

SQL

SELECT * FROM Persons
WHERE City LIKE 'TextBox.Text'

for AutoSuggestion in TextBox, see the following article:

ASP.NET Suggester - Auto-complete Control[^]

and as far as watermark is Concern, see the link below:

http://www.asp.net/ajaxLibrary/AjaxControlToolkitSampleSite/TextBoxWatermark/TextBoxWatermark.aspx[^]

Posted 23-Apr-12 23:15pm

Vipin_Arora

Updated 23-Apr-12 23:19pm

v2

Comments

Sandhya Lovely 24-Apr-12 5:21am

Sir,ur code is SELECT * FROM Persons
WHERE City LIKE 'TextBox.Text'
BUT I have Many Columns to search as......First Name, LastName,UserName, Country
and how to search all this ? please answer me

Sandhya Lovely 24-Apr-12 5:42am

Sir, Iam Unable to Understand. Please please can u post me the Design and code pages.

Vipin_Arora 25-Apr-12 8:22am

your email ID?

Anuj Banka · Answer 4 · 2012-04-24T00:59:00

Solution 4

Please check this is what you want i think

http://datatables.net/release-datatables/examples/basic_init/multi_col_sort.html[^]

this link show you an example

you can download the code and modify according to your need..

Posted 24-Apr-12 0:59am

Anuj Banka

Comments

Syed SufiyanUddin 24-Apr-12 7:03am

Boss this is correct what i want BUT where i should write this code.

Syed SufiyanUddin 24-Apr-12 7:05am

hello, where should we write this code.

Anuj Banka 24-Apr-12 7:05am

You just have to add jquery files..And need to bind your control from database.You can download the source code for this example which will help you.

Syed SufiyanUddin 24-Apr-12 7:14am

please am unable to understand, please can u tell step by step

Anuj Banka 24-Apr-12 7:15am

give me your email ID i will send you the demo code run it debug it then find it how it is working .

Anuj Banka · Answer 5 · 2012-04-24T01:12:00

XML

<script src="Scripts/jquery.js" type="text/javascript"></script>
    <script src="Scripts/jquery.dataTables.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#tblCustomers').dataTable({ "oLanguage": { "sSearch": "Search the Customers:" },
                "iDisplayLength": 5,
                "aaSorting": [[0, "asc"]]
            });
        });
</script>

    <link href="CSS/demo_table.css" rel="stylesheet" type="text/css" />
<div id="id"  >
        <asp:Repeater ID="rptCustomers" runat="server">
            <HeaderTemplate>
                <table id="tblCustomers"  cellpadding="0" cellspacing="0" border="0" class="display">
                    <thead>
                        <tr>
                            <th>
                                ContactName
                            </th>
                            <th>
                                CompanyName
                            </th>
                            <th>
                                ContactTitle
                            </th>
                            <th>
                                City
                            </th>
                            <th>
                                Country
                            </th>
                        </tr>
                    </thead>
                    <tbody>
            </HeaderTemplate>
            <ItemTemplate>
                <tr>
                    <td>
                        <%#Eval("ContactName") %>
                    </td>
                    <td>
                        <%#Eval("CompanyName")%>
                    </td>
                    <td>
                        <%#Eval("ContactTitle")%>
                    </td>
                    <td>
                        <%#Eval("City")%>
                    </td>
                    <td>
                        <%#Eval("Country")%>
                    </td>
                </tr>
            </ItemTemplate>
            <FooterTemplate>
                </tbody> </table>
            </FooterTemplate>
        </asp:Repeater>
    </div>

And In code behind you just have to bind this control

C#

List<customer> Customers = new List<customer>();
       protected void Page_Load(object sender, EventArgs e)
       {
           if (Page.IsPostBack != true)
           {
               FillCustomers();
           }
           rptCustomers.DataSource = Customers;
           rptCustomers.DataBind();
       }</customer></customer>