ansaurus

Question

Answer 1

+1 A:

Don't let the master page confuse you. It's just:

$('#btnSave').click(function() {
  //ajax call like you had
});

Khnle 2010-06-02 18:56:35

ASP.NET mangles the control IDs, which is why he was doing that funky selector.

GalacticCowboy 2010-06-02 19:00:34

No it's not work , Because button is in a content. In the html its id is changing.

Grant83 2010-06-02 19:03:05

Answer 2

A:

I think you've probably encountered a very common problem with using .NET master pages with jQuery -- .NET changes your element's id when it is part of a page generated with a master page so as to avoid name collisions. If you look at the generated source code of your page your button's id is probably something more like ct100_panel1_btnSave. If you want to use an id call you'll need to use that id. Otherwise, add a class to the button select the button by that class (.NET doesn't munge classes).

Sean Vieira 2010-06-02 19:02:14

Yeah i tried that.. But it still doesn't work

Grant83 2010-06-02 19:06:09

Answer 3

A:

Is the button a WebForm controll? If it is then the scripts that post the form might kick in before your javascript is run.

In this case use an Html element that has no runat="server" attribute.

If you are unshure about the id of the button just look at the rendered HTML.

Malcolm Frexner 2010-06-02 19:03:35

Answer 4

A:

Try

$("input[id$='btnSave']")...

to make sure it is identifying your control.

In the jQuery documentation for the square-bracket selectors, they always scope it with something else. input[selector], div[selector], etc. I've always used them that way too, so it's possible that jQuery simply doesn't know what to do with an unscoped attribute selector.

GalacticCowboy 2010-06-02 19:03:41

I'm sure that is identifying my control.

Grant83 2010-06-02 19:11:12

@user356787 - you stated that the click event is not firing, which means that it is *NOT* in fact identifying your control correctly since it doesn't wire up the event. Either the event fires, or it doesn't. Which is it?

GalacticCowboy 2010-06-02 19:17:14

Simple way to check: put an alert as the first line in your method, and see if it gets hit when you click the button.

GalacticCowboy 2010-06-02 19:19:44

Answer 5

+1 A:

ASP.NET often changes the ID of a server control, so hard-coding the control ID in your Javascript is not ideal. In the cast of Master Pages, ASP.NET prepends the ID with the Master Page's ContentPlaceholder ID (i.e. MainContent_btnSave).

What you can do is use server code inline with the javascript: <%=btnSave.ClientId%> instead of btnSave.

If the Javascript is in the .ASPX file:

$("#<%=btnSave.ClientId%>").click(function() {
   /* ... */
}

If the JS is in a separate file, just declare the button as a variable and call the variable in your JS code.

.ASPX:

var btnSave = $("#<%=btnSave.ClientId%>");

.JS:

$(btnSave).click(function() {
   /* ... */
}

By the way, if you're using C#, you may need to use <%=btnSave.ClientId()%> instead of VB's <%=btnSave.ClientId%>.

Paperjam 2010-06-02 19:20:33

Answer 6

A:

$(document).ready(function() {
    $("#btnSubmit").click(function(event) {

        //
    });
});

Abu Hamzah 2010-06-02 20:05:36

Answer 7

+1 A:

If you are using a ContentPlaceHolder in the head section, make sure it is below the line where you load jQuery.

Master Page:

<head runat="server">
<script src="<%=ResolveUrl("~/Scripts/jquery-1.4.2.min.js") %>"></script>
<asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
</head>

You may also want to look at your generated markup and see what the ID is for your button. If it is in a nested master page or a control it may not end with btnSave.

    <asp:Content ID="HeadContent" ContentPlaceHolderID="head" runat="server">
<script>
        $(function(){
             $('input[id*="btnSave"]').click(function(){
                  ....
             });
        });
</script>
    </asp:Content>

TheJuice 2010-06-02 20:22:35

ansaurus

tags:

views:

answers:

Master Page and Jquery Problem?

related questions