Adding Client Clicked Event disables button events server/client both

2 posts, 0 answers
  1. Jawwad
    Jawwad avatar
    10 posts
    Member since:
    Dec 2014

    Posted 27 Dec 2014 Link to this post

    This is my button. Adding onclick event disables

    1. the mouseover / mouseout css
    2. click event on server side
    3. client javascript function is not working

    <telerik:RadButton ID="btnEdit" runat="server" Icon-PrimaryIconCssClass="rbEdit" Icon-PrimaryIconLeft="4" Icon-PrimaryIconTop="3" Width="20px" ToolTip="Edit" OnClick="btnEdit_Click" OnClientClicked="return checkId();"></telerik:RadButton>

    function checkId() {
                if (document.getElementById("<%=hidPointId.ClientID%>").value == '')
                { return false; }
    { return true; }
  2. Konstantin Dikov
    Konstantin Dikov avatar
    2119 posts

    Posted 29 Dec 2014 Link to this post

    Hi Jawwad,

    First, the way that you are setting the event handler is incorrect. In the context of controls from our suite, you should set as an event handler only the name of the function:

    If you inspect your browser console with your current implementation you will notice that there is a JavaScript error, due to the way that you are setting the event handler.

    Additionally, the OnClientClicked client-side event of the RadButton could not be canceled and generally, a combination of client-side and server-side click event is not recommended.

    For your scenario, you should handle the OnClientClicking event, which could be canceled through the args.set_cancel(true) method:
    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
        <script type="text/javascript">
            function checkId(sender, args) {
                if (somecondition) {
    <telerik:RadButton ID="btnEdit" runat="server" Icon-PrimaryIconCssClass="rbEdit" Icon-PrimaryIconLeft="4"
        Icon-PrimaryIconTop="3" Width="20px" ToolTip="Edit" OnClick="btnEdit_Click" OnClientClicking="checkId">

    Hope this helps.

    Konstantin Dikov

    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.

Back to Top