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

OnClientClicked for Rad Button doesn'y work properly

12 Answers 2355 Views

Button

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

12 Answers, 1 is accepted

Accepted

answered on 17 Nov 2010, 12:13 PM

Hi Brian,

The OnClientClicked property of the RadButton control expects the name of the javascript function that will handle the clicked client-side event. Please visit our online demo showing the client events of the RadButton control: http://demos.telerik.com/aspnet-ajax/button/examples/clientsideevents/defaultcs.aspx.

Here is how you can achieve your specific scenario:

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>

</head>

<body>

<form id="form1" runat="server">

<asp:ScriptManager ID="ScriptManager1" runat="server">

</asp:ScriptManager>

<script type="text/javascript">

function OnClientClicked(button, args)

{

if (window.confirm("Are you sure you want to submit the page?"))

{

button.set_autoPostBack(true);

}

else

{

button.set_autoPostBack(false);

}

</script>

<div>

<telerik:RadButton ID="RadButton1" runat="server" Text="RadButton" OnClick="RadButton1_Click"

OnClientClicked="OnClientClicked">

</telerik:RadButton>

<br />

<asp:Label ID="Label1" runat="server"></asp:Label>

</div>

</form>

</body>

</html>

using System;

using System.Collections.Generic;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using Telerik.Web.UI;

public partial class Default_Button : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

}

protected void RadButton1_Click(object sender, EventArgs e)

{

Label1.Text = DateTime.Now.ToString();

}

Regards,
Pero
the Telerik team

Browse the vast support resources we have to jumpstart your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

answered on 29 Nov 2010, 04:17 PM

Hello,

With RadConfirm it is a little bit different since the RadConfirm does not stop the execution of the code. Here is a sample that shows how to use RadButton with RadConfirm:

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>

</head>

<body>

<form id="form1" runat="server">

<asp:ScriptManager ID="ScriptManager1" runat="server">

</asp:ScriptManager>

<script type="text/javascript">

var fireConfirm = true;

function OnClientClicked(button, args)

{

var callBackFunction = Function.createDelegate(button, function (argument)

{

if (fireConfirm && argument)

{

this.set_autoPostBack(true);

fireConfirm = false;

this.click();

}

});

if (fireConfirm)

{

button.set_autoPostBack(false);

var text = "Are you sure you want to submit the page?";

var result = radconfirm(text, callBackFunction, 300, 100, null, "Title");

}

</script>

<div>

<telerik:RadWindowManager ID="RadWindowManager1" runat="server">

</telerik:RadWindowManager>

<telerik:RadButton ID="RadButton2" runat="server" Text="RadConfirm" OnClick="RadButton1_Click"

OnClientClicked="OnClientClicked">

</telerik:RadButton>

<asp:Label ID="Label1" runat="server"></asp:Label>

</div>

</form>

</body>

</html>

using System;

using System.Collections.Generic;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using Telerik.Web.UI;

public partial class Default_Button : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

}

protected void RadButton1_Click(object sender, EventArgs e)

{

Label1.Text = DateTime.Now.ToString();

}

Sincerely yours,
Pero
the Telerik team

answered on 18 Dec 2010, 07:54 PM

I am having a similar problem using 2010.3.1109.35 of the RadButton.

I have tried the example in this forum post, with a method that looks similar to the following:

 function DelButtonClicking(sender, args) {
        var del = confirm("Please confirm delete?");
        sender.set_autoPostBack(del);
    }

However, after setting the OnClickingClicking js handler, the RadButton does not post back.

I also tried the example on this page:
http://demos.telerik.com/aspnet-ajax/button/examples/clientsideapi/defaultcs.aspx

which uses the args.set_cancel(bool) method, with the same result.
function OnClientClicking(sender, args)
        {
            if (sender.get_navigateUrl() && sender.get_buttonType() == Telerik.Web.UI.RadButtonType.LinkButton)
            {
                var RadWindow = $find("<%=RadWindow1.ClientID%>");
                RadWindow.setUrl(sender.get_navigateUrl());
                RadWindow.set_title(sender.get_navigateUrl());
                RadWindow.show();
                args.set_cancel(true);
            }
        }

Ok, I think found my problem, I was using OnClientClicking, not OnClientClicked. It does work now using the

set_autoPostBack example.

answered on 30 Oct 2014, 04:00 PM

Hi All,

If you want to use the set_autoPostBack() method in events make sure that this happens at an earlier stage(i.e., the cancellable OnClientClicking event and not the OnClientClicked event).

I would also suggest when you want to cancel a postback you use the accepted and officially documented approach - set the set_cancel(true) method of the event argument of OnClientClicking event. See an example in the OnClientClicking help article.

If you want to use callback function with radconfirm, please follow the approach from this online demo. Said shortly:
ASPX:

<telerik:RadScriptManager ID="RadScriptManager1" runat="server"></telerik:RadScriptManager>

<telerik:RadWindowManager ID="RadWindowManager1" runat="server"></telerik:RadWindowManager>

<script>

function RadConfirm(sender, args) {

var callBackFunction = Function.createDelegate(sender, function (shouldSubmit) {

if (shouldSubmit) {

this.click();

}

});

var text = "Are you sure you want to submit the page?";

radconfirm(text, callBackFunction, 300, 160, null, "RadConfirm");

args.set_cancel(true);

}

</script>

<telerik:RadButton ID="btnRadConfirm" runat="server" Text="RadConfirm" OnClientClicking="RadConfirm"

OnClick="Button_Click">

</telerik:RadButton>

<asp:Label ID="Label1" Text="" runat="server" />

C#:

protected void Button_Click(object sender, EventArgs e)

{

RadButton btn = sender as RadButton;

Label1.Text = "The <strong>RadConfirm Button</strong> submitted the page at: " + DateTime.Now.ToString();

}

Regards,
Danail Vasilev
Telerik

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

answered on 05 Jan 2015, 08:18 AM

RadButton-OnMouseOutOver-Test.zip

Hi Jawwad,

I wasn't able to reproduce the mentioned issue - the OnMuseOver/OnMouseOut events are properly triggered when added to the provided code. You can watch the short video test and then tell me if I am missing something.

Can you please try to reproduce the problem with the attached example and then tell me what changes you have made, so that I can make a further investigation?

Regards,
Danail Vasilev
Telerik

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

OnClientClicked for Rad Button doesn'y work properly

12 Answers, 1 is accepted