How to use jQuery in ASP.NET 4 master pages

Question

I have an ASP.NET 4 web app. I am using a Master Page Site.Master. The head of the master page is:

<head runat="server">
<title></title>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.4.js">
</script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.4-vsdoc.js">
</script>
<link href="~/Styles/Site.css" rel="stylesheet" type="text/css" />
<asp:ContentPlaceHolder ID="HeadContent" runat="server">
</asp:ContentPlaceHolder>
</head>

Currently in the content page, I have:

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
<% if (false)
   { %>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.4.js"></script>
<% } %>
<script type="text/javascript">
    $(document).ready(function () {
        alert("Welcome jQuery !");
    });
</script>
<script type="text/javascript">
function Blam() { alert("Welcome jQuery !"); }; </script>

My content Page must show an alert when a button "ViewButton" is pressed! i,e, the ViewButton must call function Blam! How do I do that??

If I run this code, I get an exception:

readyBound is not defined!

The exception is in file: jquery-1.4.4-vsdoc.js The call stack is: bindReady JScript ready JScript JScript global code JScript

Is this an ASP control or a "traditional" HTML control? You may have to reference the control's `ClientID`. — Brad Christie, Mar 01 '11 at 14:24
@Brad the Button is ASP control. It looks like: What changes shall I do? — manishKungwani, Mar 01 '11 at 15:40
Try, in your code behind, binding the function (like so: `this.ViewButton.Attributes.Add("onClick", "return Blam();")`) — Brad Christie, Mar 01 '11 at 16:23

score 4 · Accepted Answer · answered Mar 01 '11 at 14:24

4

Don't include jquery-1.4.4-vsdoc.js in your actual site; it is not meant to be functional.

Visual Studio should automatically read that the vsdoc when you include jquery-1.4.4.js.
Alternatively, you can include the vsdoc inside an if (false).

answered Mar 01 '11 at 14:24

SLaks

868,454
176
1,908
1,964

score 2 · Answer 2 · answered Mar 01 '11 at 14:26

2

You don't need to include the vsdoc file on your web page - it just needs to be in the same folder as your jquery file and just provides intellisense for Visual Studio.

answered Mar 01 '11 at 14:26

Tim Rogers

21,297
6
52
68

How to use jQuery in ASP.NET 4 master pages

2 Answers2