This is a migrated thread and some comments may be shown as answers.

Clicking a button inside a ajaxified usercontrol using javascript

1 Answer 80 Views
Grid
This is a migrated thread and some comments may be shown as answers.
saravanan k
Top achievements
Rank 1
saravanan k asked on 16 Aug 2010, 02:08 PM

Hi,

I am having a radgrid assosiated with a radajaxmanager and radajaxloadingpanel. I am using usercontrol insert and edit forms. I am having a button inside insert form (usercontrol). On click of that button i want to confirm with the user. So i wrote the script to call a radconfirm onclientclick of that button and if [OK] button is clicked in the confirm box, i am programatically calling the button click from javascript code using buttonObj.click();

My code works well in following cases,
                  1. if i use image button in place of asp:button (or)
                   2. if i remove the radajaxmanager and ajaxpanel from the the parent page.

But not with the normal asp:button. Can you please help me in sorting out the problem.

My script to call radconfirm,


<script type="text/javascript"
        var buttonObj; 
        var confirmValue = false
      
        function UpdateConfirm(btn) { 
            if (!confirmValue) { 
                buttonObj= btn; 
                var confirmString = "Do you wish to update?."
                radconfirm(confirmString, UpdateConfirmCallBackFn, 300, 120, "", "Confirm Update"); 
                return false
            
        
  
    function UpdateConfirmCallBackFn(arg) { 
        if (arg) { 
            confirmValue= true
            buttonObj.click();
        
   }

My button inside the usercontrol insert form,

<asp:Button ID="btnUpdate" runat="server" Text="Update"
        ValidationGroup="grp" OnClick="btn_Click" OnClientClick="return UpdateConfirm(this);" />

My RadAjaxManager Code in the parent grid page,

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Default"
            Loading... 
        </telerik:RadAjaxLoadingPanel
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" DefaultLoadingPanelID="RadAjaxLoadingPanel1"
            <AjaxSettings
                <telerik:AjaxSetting AjaxControlID="grid1"
                    <UpdatedControls
                        <telerik:AjaxUpdatedControl ControlID="grid1" /> 
                                            </UpdatedControls
                </telerik:AjaxSetting
            </AjaxSettings
        </telerik:RadAjaxManager>

Regards,
Saravanan K

1 Answer, 1 is accepted

Sort by
0
Veli
Telerik team
answered on 19 Aug 2010, 11:49 AM
Hi saravanan,

Try the following OnClientClick definition instead:

<asp:Button ID="btnUpdate" runat="server" Text="Update"
        OnClick="btn_Click" OnClientClick="if(!UpdateConfirm(this)) return false;" />

And you have to modify the UpdateConfirm() function to always return either true or false:

function UpdateConfirm(btn)
{
    if (!confirmValue)
    {
        buttonObj = btn;
        var confirmString = "Do you wish to update?.";
        radconfirm(confirmString, UpdateConfirmCallBackFn, 300, 120, "", "Confirm Update");
        return false;
    }
    else
    {
        confirmValue = false;
        return true;
    }
}

This should be working OK now. The reason it doesn't work with your version is because the AJAX manager replaces submit buttons (<input type="submit">) with push buttons (<input type="button" onclick="__doPostBack(...)">). So, what happens when you attach a return someMethod() type of function call to onclick is:

<input type="button" onclick="return UpdateConfirm(this); __doPostBack(...)" />

You can note that the above method call will return just before __doPostBack() no matter the return value. So, __doPostBack() is never executed. Modifying the way we call UpdateConfirm() to the above version generates an <input> of the form:

<input type="button" onclick="if(!UpdateConfirm(this)) return false;__doPostBack(...)" />

The above script will return only if UpdateConfirm() returns false. So, you need to return true to have __doPostBack() reached. Hence the requirement to explicitly return true from your code when you have passed the confirmation.

The above scenario does not happen with ImageButtons or LinkButtons because they are not modified.

Regards,
Veli
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
Tags
Grid
Asked by
saravanan k
Top achievements
Rank 1
Answers by
Veli
Telerik team
Share this question
or