How to call UpdatePanel using a TextBox control?

Question

Consider the following code:

<label>Search:</label><asp:TextBox runat="server" ID="search" ClientIDMode="Static" OnKeyUp="$('#searchButton').click();" /><asp:Button runat="server" ID="searchButton" ClientIDMode="Static" /> <asp:UpdatePanel runat="server" UpdateMode="Conditional"> <ContentTemplate> <asp:GridView runat="server" DataSourceID="EntityDataSource1" AllowPaging="True" AllowSorting="True" AutoGenerateColumns="true" PageSize="20" Width="400" /> </ContentTemplate> <Triggers> <asp:AsyncPostBackTrigger ControlID="searchButton" /> </Triggers> </asp:UpdatePanel> 

The button causes the panel to be updated. I wanted to trigger an update using the keydown of the search field, so I "fake" it using the jQuery instruction, which clicks the button. I wonder ... there must be a better way ... right !?

Answer 1

You can do this to update your updated panel without a button:

 <script type="text/javascript"> function refreshPanel() { __doPostBack('<%= updatePanel.UniqueID %>', ''); } </script> <label>Search:</label> <asp:TextBox runat="server" ID="search" ClientIDMode="Static" OnKeyUp="refreshPanel();" /> <asp:UpdatePanel runat="server" ID="updatePanel"> 

You just need to provide your update with an ID field (updatePanel here)

Run this code on the keyboard or whenever you are ready for it.

Answer 2

The link is a bit outdated, but pretty much will do what you want:
http://remy.supertext.ch/2007/06/see-search-results-as-you-type-an-aspnet-ajax-control/