ASP.net button Jquery BlockUI

Question

I'm having trouble getting an ASP button to call a jquery script, in this case BlockUI, but I'm not sure what I'm doing wrong?

<asp:Button runat="server" ID="btnAddUser" Text="Add Currency Combination" ValidationGroup="valSum2" CssClass="showHide" OnClientClick="overlay"

    <script type="text/javascript" language="javascript">
    $(document).ready(function() { 
        $('#overlay').click(function() { 
        $.blockUI({ overlayCSS: { backgroundColor: '#00f' } }); 
    setTimeout($.unblockUI, 2000);
    }); 
});  </script>

score 3 · Accepted Answer · answered Mar 06 '12 at 12:23

You can call it using the css classname .ShowHide

    <script type="text/javascript" language="javascript">
    $(document).ready(function() { 
        $('.showHide').click(function() { 
        $.blockUI({ overlayCSS: { backgroundColor: '#00f' } }); 
    setTimeout($.unblockUI, 2000);
    }); 
});  </script>

Stilgar · Answer 2 · 2012-03-06T12:37:23.340

Your script is looking for a DOM element with ID "overlay" which does not exist. The id of the button is btnAddUser.ClientID

<asp:Button runat="server" ID="btnAddUser" Text="Add Currency Combination" ValidationGroup="valSum2" CssClass="showHide" />  

    <script type="text/javascript" language="javascript">  
    $(document).ready(function() {   
        $('<%= btnAddUser.ClientID %>').click(function() {   
        $.blockUI({ overlayCSS: { backgroundColor: '#00f' } });   
    setTimeout($.unblockUI, 2000);  
    });   
});  </script>

Note the removal of OnClientClick!

Alternatively you can make this code a named function and type its name in the OnClientClick property. You can also bind by CssClass ( $('.showHide') ) (see @PraveenVenu's answer) but this will bind the function to all elements that use this css class.

Hmm that doesn't seem to work, do I need to do something with the .ClientID? — Rexxo, Mar 06 '12 at 12:38
Ahh, the CSS approach seemed to work. It's fine as the button is the only one to use that class. Thanks!! — Rexxo, Mar 06 '12 at 12:42

score 0 · Answer 3 · answered Mar 06 '12 at 12:21

0

use ()

you have to execute the func ...

 OnClientClick="overlay()"

answered Mar 06 '12 at 12:21

Royi Namir

144,742
138
468
792

There isn't a function called overlay. – Reinstate Monica Cellio Mar 06 '12 at 12:41
@Archer I only told him to run the function with parenthesis. – Royi Namir Mar 06 '12 at 12:57
1

But there isn't one??? It's not good advice to tell him to do something that will not work unless you explain why you're telling him. – Reinstate Monica Cellio Mar 06 '12 at 13:21

ASP.net button Jquery BlockUI

3 Answers3

Linked