RadAjaxManagerProxy and asp:Button

5 posts, 1 answers
  1. John
    John avatar
    8 posts
    Member since:
    Feb 2012

    Posted 11 Jun 2013 Link to this post

    Hi,
    Following is my code.
    --------------------------------
    <telerik:RadAjaxManagerProxy ID="rdAjaxMgrProxy" runat="server">         
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="btnSearch">
                    <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="rgvUserData" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManagerProxy>
    <asp:Button ID="btnSearch" runat="server" Text="Search" OnClientClick="return true;" /> 
    ------------------

    And in code behind, I have a function which I want to run when button is clicked. 
    Now when I click the button, server side code doesn't run.

    it runs if I
    1. Remove OnClientClick event from Button control
    or
    2. Remove btnSearch from RadAjaxManagerProxy block.

    I can't do either because I need both the things. I want to validate my page when button is clicked by client JavaScript.
    And I want my grid to be updated by Ajax once validation is complete.

    Regards,
    John
  3. Viktor Tachev
    Admin
    Viktor Tachev avatar
    2497 posts

    Posted 14 Jun 2013 Link to this post

    Hi John,

    In the code you have provided there is only OnClientClick event defined for the button. It is a client-side event and does not seem to have a handler attached.

    In order to run the client-side Javascript and the server-side code behind you would need to attach a handler to the OnClientClik event and also add the OnClick server event. Note that it is recommended not to use return directly in the OnClientClick event. You should call a handler and use it to return true or false.

    <asp:Button ID="Button1" runat="server" Text="click"  OnClientClick="foo();" OnClick="Button_Click" />

    Javascript:

    function foo() {
    alert('test');
    return true;
    }


    I hope this helps.

    Regards,
    Viktor Tachev
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
  5. John
    John avatar
    8 posts
    Member since:
    Feb 2012

    Posted 14 Jun 2013 Link to this post

    Hi Victor,
    I have done as suggested by you, but it runs server side code even if I return False from clientside function.
    <asp:Button ID="Button1" runat="server" Text="click"  OnClientClick="foo();" OnClick="Button_Click" />

    JavaScript
    function foo() {
    alert('test');
    return false;
    }

    ==========
    Now when I click the button, it gives me alert (of test) but it also runs function Button_Click on server side. I don't want page to be post back if javascript returns false.


    it works fine if I don't use button in RadAjaxManagerProxy block - I need to put button into that block as per my requirement.

    Regards,
    John
  7. Answer
    Viktor Tachev
    Admin
    Viktor Tachev avatar
    2497 posts

    Posted 17 Jun 2013 Link to this post

    Hi John,

    Thank you for writing back.

    When there is Ajax enabled for the Button control doPostback event handler is automatically added to the OnClientClick event. If you inspect the rendered html of the page you would see this for the Button:

    <input name="Button1" id="Button1" onclick="foo();__doPostBack('Button1','')" type="button" value="click"/>

    The doPostback function is called after foo() regardless of the returned result. In order to work around this you could use a condition in the client-side event that returns false explicitly. The definition for the button would look like so:

    <asp:Button ID="Button1" runat="server" Text="click" OnClientClick="if (!foo()) return false;" OnClick="Button1_Click" />

    The rendered code for the Button would look like below:

    <input name="Button1" id="Button1" onclick="if (!foo()) return false;__doPostBack('Button1','')" type="button" value="click"/>

    This time when a value is returned the doPostback() function will not be called.

    I am attaching a sample project illustrating this approach. Give this approach a try and you should have no problems.

    Regards,
    Viktor Tachev
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
  9. John
    John avatar
    8 posts
    Member since:
    Feb 2012

    Posted 18 Jun 2013 Link to this post

    Hi Victor,

    Your solution worked.

    Thanx.

    Regards,
    John
Back to Top