UpdatePanelTriggers TextBox.onKeyUp

Discussion in 'ASP .Net' started by mc, Jul 4, 2007.

  1. mc

    mc Guest

    Can someone suggest how I would add a new trigger such that when the JS event onkeyup in a textbox
    the updatePanel refreshes?

    If not could someone sugest how I could onkepup in a Textbox, refresh the contents of a
    gridview/repeater control?

    TIA


    MC
     
    mc, Jul 4, 2007
    #1
    1. Advertising

  2. MC-

    Googling "updatepanel" and "javascript" will come up with various solutions.
    Here's one I've picked apart from various blogs and forum posts that works
    for me.

    Here's what you'll need:

    1. A javascript function to call __doPostBack.

    2. A <asp:HiddenField /> inside your UpdatePanel that you want to update.
    This helps "tag" the panel to ensure you're updating the correct one.

    3. The onKeyUp javascript event on your TextBox control. Note: This will
    throw a fit because VS2005 and Orcas do not recognize this as a valid event
    for a TextBox (anyone know why or if that will change?).

    In the Header of the page (or posted via Page.Header in codebehind), your
    JavaScript will look something like:

    <script type="text/javascript">
    function updatePanelPostback()
    {
    __doPostBack("<%=upHiddenPostback.ClientID%>","");
    }
    </script>

    This JavaScript will do a postback based on the ClientId of a hidden field
    we'll add here in a moment.

    Your TextBox control, the one you want to use to generate the onKeyUp event,
    will call that JavaScript function.

    <asp:TextBox ID="TextBox1" runat="server" OnKeyUp="javascript:updatePanelPostback();"
    />

    Finally, your update panel will have an additional HiddenField tag.

    <asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="true"
    UpdateMode="Conditional">
    <contenttemplate>
    <asp:GridView ID="GridView1" runat="server">
    </asp:GridView>
    <asp:HiddenField runat="server" ID="upHiddenPostback" />
    </contenttemplate>
    </asp:UpdatePanel>

    Also, you can pass the HiddenField.ClientID as a parameter to your JavaScript
    call to make it more reusable.

    You can also tie this to any JavaScript event, like onClick, to force a specified
    update.

    HTH.

    -dl

    --
    David R. Longnecker
    http://blog.tiredstudent.com

    > Can someone suggest how I would add a new trigger such that when the
    > JS event onkeyup in a textbox the updatePanel refreshes?
    >
    > If not could someone sugest how I could onkepup in a Textbox, refresh
    > the contents of a gridview/repeater control?
    >
    > TIA
    >
    > MC
    >
     
    David R. Longnecker, Jul 4, 2007
    #2
    1. Advertising

  3. mc

    mc Guest

    Thanks, That works well, was hoping for a cleaner solution though!

    Regards


    MC

    David R. Longnecker wrote:
    > MC-
    >
    > Googling "updatepanel" and "javascript" will come up with various
    > solutions. Here's one I've picked apart from various blogs and forum
    > posts that works for me.
    >
    > Here's what you'll need:
    >
    > 1. A javascript function to call __doPostBack.
    >
    > 2. A <asp:HiddenField /> inside your UpdatePanel that you want to
    > update. This helps "tag" the panel to ensure you're updating the correct
    > one.
    >
    > 3. The onKeyUp javascript event on your TextBox control. Note: This
    > will throw a fit because VS2005 and Orcas do not recognize this as a
    > valid event for a TextBox (anyone know why or if that will change?).
    >
    > In the Header of the page (or posted via Page.Header in codebehind),
    > your JavaScript will look something like:
    >
    > <script type="text/javascript">
    > function updatePanelPostback()
    > {
    > __doPostBack("<%=upHiddenPostback.ClientID%>","");
    > }
    > </script>
    >
    > This JavaScript will do a postback based on the ClientId of a hidden
    > field we'll add here in a moment.
    >
    > Your TextBox control, the one you want to use to generate the onKeyUp
    > event, will call that JavaScript function.
    >
    > <asp:TextBox ID="TextBox1" runat="server"
    > OnKeyUp="javascript:updatePanelPostback();" />
    >
    > Finally, your update panel will have an additional HiddenField tag.
    >
    > <asp:UpdatePanel ID="UpdatePanel1" runat="server"
    > ChildrenAsTriggers="true" UpdateMode="Conditional">
    > <contenttemplate>
    > <asp:GridView ID="GridView1" runat="server">
    > </asp:GridView>
    > <asp:HiddenField runat="server" ID="upHiddenPostback" />
    > </contenttemplate>
    > </asp:UpdatePanel>
    >
    > Also, you can pass the HiddenField.ClientID as a parameter to your
    > JavaScript call to make it more reusable.
    >
    > You can also tie this to any JavaScript event, like onClick, to force a
    > specified update.
    >
    > HTH.
    >
    > -dl
    >
    > --
    > David R. Longnecker
    > http://blog.tiredstudent.com
    >
    >> Can someone suggest how I would add a new trigger such that when the
    >> JS event onkeyup in a textbox the updatePanel refreshes?
    >>
    >> If not could someone sugest how I could onkepup in a Textbox, refresh
    >> the contents of a gridview/repeater control?
    >>
    >> TIA
    >>
    >> MC
    >>

    >
    >
     
    mc, Jul 5, 2007
    #3
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Brad
    Replies:
    3
    Views:
    15,782
  2. Jay

    Auto tab in Datagrid onKeyUp

    Jay, Aug 10, 2006, in forum: ASP .Net
    Replies:
    0
    Views:
    634
  3. Jay

    Auto tab in Datagrid onKeyUp

    Jay, Aug 10, 2006, in forum: ASP .Net Datagrid Control
    Replies:
    0
    Views:
    198
  4. Matthew
    Replies:
    5
    Views:
    155
    Lasse Reichstein Nielsen
    Feb 10, 2004
  5. Trent

    Help Capturing an onkeyup event

    Trent, Apr 23, 2004, in forum: Javascript
    Replies:
    3
    Views:
    195
    Evan Wong
    May 26, 2004
Loading...

Share This Page