CODEWITHSUNDEEP
javascriptc#jqueryasp.net
ako
ako

Reputation: 2136

jquery not work in asp.net

i have an asp.net website i want when a label is clicked then an alert for example be fired using jquery but it does not work : here is what i tried :

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script type="text/javascript">
    $('#scheduled').click(function () {
        alert("alert something");//not work
    });
    $('.ako').click(function (e) {
        alert("alert something");//not work
    });
    $("#<% =scheduled.ClientID%>").click(function (e) {
        alert("alert alert alert");//not work
    });
</script>

and here is the Label tag :

            <asp:Panel runat="server" CssClass="row">
            <asp:Label runat="server" CssClass="btn btn-primary btn-lg " class="ako"    Style="margin: 10px" ID="scheduled" Text="scheduled" />
        </asp:Panel>

i user master page and this code is in Default.aspx page .

none of jquery ( javascript ) alerts work . thanks .

Upvotes: 2

Views: 1057

Answers (2)

prospector
prospector

Reputation: 3469

<asp:Label runat="server" CssClass="btn btn-primary btn-lg " class="ako"    Style="margin: 10px" ID="scheduled" ClientIDMode="Static" Text="scheduled" />

Set the client ID mode to static. Use firebug to look at the name of your controls, web form changes the names of the controls if you don't set the client id mode to static and your jquery will not work.

This is because .net prefixes the control names respectively related to their containers.

And wrap the code with document.ready to ensure the dom elements are loaded.

https://weblog.west-wind.com/posts/2009/nov/07/clientidmode-in-aspnet-40

Upvotes: 3

Pranav C Balan
Pranav C Balan

Reputation: 115282

Wrap the code by document ready handler to bind event handler after elements are loaded or move the code at the end of page.

$(document).ready(function(){
    $('#scheduled').click(function () {
        alert("alert something");//not work
    });
    $('.ako').click(function (e) {
        alert("alert something");//not work
    });
    $("#<% =scheduled.ClientID%>").click(function (e) {
        alert("alert alert alert");//not work
    });
});

Upvotes: 5

Related Questions