5

I have a webpage. I show records from table, lets say, students in my page. I query all the students and show them in grid. I want to use a textbox for filtering the datagridview results. For example if the user types a in the textbox the grid will show only the students who has "a" in his/her name. I want to refresh the grid at the same time while textbox is being edited.

i have set the autopostback property of textbox to true, and i refresh the grid in textbox's textchanged event.But the textchanged event fires only after the textbox loses focus. How can I make it fire after user types just one character ? thanks.

Ozgur Dogus
  • 911
  • 3
  • 14
  • 38
  • 1
    You should use AJAX, othewise.. any char type fire post back event.. not good.. – Thit Lwin Oo Feb 14 '12 at 14:47
  • 1
    are you sure you want to cause a postback after every keypress? Even if you wrap everything inside an update panel your user is still going to have to wait for the page to refresh before being able to type another character. – rie819 Feb 14 '12 at 14:49
  • There's quite a few similar questions on [here](http://stackoverflow.com/questions/1009086/how-to-make-an-asp-net-textbox-fire-its-ontextchanged-event-fire-in-an-ajax-upd) – Precious Roy Feb 14 '12 at 14:54

5 Answers5

3

You have to use the onKeyDown event. However, I'd advise you to use ASP.NET AJAX or jQuery to load the results with Ajax.

Here is one example from asp.net: http://www.asp.net/ajaxlibrary/AjaxControlToolkitSampleSite/AutoComplete/AutoComplete.aspx

Another one, from Code project: http://www.codeproject.com/Articles/38803/Google-Like-Search-TextBox

Schiavini
  • 2,869
  • 2
  • 23
  • 49
  • sorry, i didnt mention.my controls are already in updatepanel. Textbox does not have onKeyDown. how can i implement it. Thanks – Ozgur Dogus Feb 14 '12 at 14:52
  • Just add it as text, asp.net will not recognize and will add it straight to the HTML – Schiavini Feb 14 '12 at 15:09
  • However, the textbox should not be inside the update panel, else the user will not be able to type normally. You should update the updatePanel from JavaScript – Schiavini Feb 14 '12 at 15:12
2

You might want to show some your present code, if there is a particular method you want to go with for this. Otherwise your going to get a people telling you the way they would do it.

Does it look something like this right now?

<asp:Textbox id="myTextbox" runat="server" onChange="txtChanged" AutoPostBack="true"/>

public void txtChanged(object sender, EventArgs e)
{
    //Get text from textbox
    string text = ((TextBox)sender).Text;

    //Do what ever it is you want to do to edit the text
    text = text.ToUpper();

    //Update the other textbox with this text
    txtMyText2.Text = text;
}
Precious Roy
  • 1,086
  • 1
  • 9
  • 19
  • Yes i did almost same thing. Plus i used an autocompleteextender with my textbox as well. Thanks. – Ozgur Dogus Feb 14 '12 at 14:57
  • This is probably your problem, I'm seeing lots of posts about how [AutoCompleteExtender will suppress your TextChanged event](http://forums.asp.net/t/1022600.aspx/1) – Precious Roy Feb 14 '12 at 15:16
  • If you got the money for Telerik, it's usually your best bet, but they aren't cheap. It's not always easy to setup though, and there are certain levels of complexity that it will fail at too. And there are other free projects out there that have nice controls you can use. – Precious Roy Feb 14 '12 at 15:19
  • Have you used them ? I have doubts about 3rd party controls' performances. – Ozgur Dogus Feb 15 '12 at 09:08
1

The event TextChanged only fires when you send a request to server. If you wanna launch an event or make a function when the text inside textbox changes, use an OnKeyDown event (right with Schiavini).

jAC
  • 5,195
  • 6
  • 40
  • 55
Drako
  • 769
  • 1
  • 8
  • 23
1

I think the best and most clean way is to use Rad Controls, here is an example on how to do it: http://demos.telerik.com/aspnet-ajax/controls/examples/integration/gridandcombo/defaultcs.aspx?product=grid

Alex
  • 5,971
  • 11
  • 42
  • 80
  • ok i guess i will use a rad control for this. telerik's control seems more neat. javascript work arounds seemed to me as if they need more work, because i will use data binding etc. i guess it will be hard to do it with js. – Ozgur Dogus Feb 15 '12 at 14:06
  • yes with rad controls it is very neat, easy and documented. contact me if you needed any help. – Alex Feb 16 '12 at 07:22
0

You can use PicNet to do this in the Client instead of the Server for a better User experience. You can find it here http://www.picnet.com.au/resources/tablefilter/demo.htm Remember that the Gridview is rendered as a HTML table, therefore you can freely use this jQuery plugin.

Good luck!

Hanlet Escaño
  • 17,114
  • 8
  • 52
  • 75