I have an error trying to use $(document).ready() as in the above image. What should i try to solve this problem ?
Edit 23/05/2011 10:54
I have got a clue. The page i am working inherit from masterpage
In master page this code isn't work, maybe problem of different path
<head id="Head1" runat="server">
<title>Back Office</title>
<link href="~/Styles/MasterPage.css" rel="stylesheet" type="text/css" />
<link href="Styles/custom-theme/jquery-ui-1.8.12.custom.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="scripts/jquery-1.5.1.min.js"></script>
<asp:ContentPlaceHolder ID="HeadContent" runat="server">
</asp:ContentPlaceHolder>
</head>
This code don't seems to work
On the body of master page, there is a script manager and jquery is there, This make the jQuery works, is because we use scriptmanager in the body so that the document.ready is not work ?
<asp:ScriptManager ID="ScriptManager1" runat="server" OnAsyncPostBackError="ScriptManager1_AsyncPostBackError">
<Scripts>
<asp:ScriptReference Path="~/Scripts/jquery-1.5.1.min.js" />
</Scripts>
</asp:ScriptManager>
<asp:ContentPlaceHolder ID="MainContent" runat="server">
</asp:ContentPlaceHolder>
I have found the problems.
The problem is the jquery code is on the masterpage, in the script manager, and script manager is in inside the body tag.
the document.ready is on the header tag on page that inherit on master page, so before the code to excuting to the body, the jquery is not included yet and that wat it is error.
The easiest way to solve this is, i have to move javascript code in the bottom of body tag. The proper way to solve, which i still can't find is to put the javascript include code in the header. but i don't find a way that work yet. My master page and inherit page is on the differnt path. I have find a lot of technique such as but none of them work.
I have an error trying to use $(document).ready() as in the above image. What should i try to solve this problem ?
Edit 23/05/2011 10:54
I have got a clue. The page i am working inherit from masterpage
In master page this code isn't work, maybe problem of different path
<head id="Head1" runat="server">
<title>Back Office</title>
<link href="~/Styles/MasterPage.css" rel="stylesheet" type="text/css" />
<link href="Styles/custom-theme/jquery-ui-1.8.12.custom.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="scripts/jquery-1.5.1.min.js"></script>
<asp:ContentPlaceHolder ID="HeadContent" runat="server">
</asp:ContentPlaceHolder>
</head>
This code don't seems to work
On the body of master page, there is a script manager and jquery is there, This make the jQuery works, is because we use scriptmanager in the body so that the document.ready is not work ?
<asp:ScriptManager ID="ScriptManager1" runat="server" OnAsyncPostBackError="ScriptManager1_AsyncPostBackError">
<Scripts>
<asp:ScriptReference Path="~/Scripts/jquery-1.5.1.min.js" />
</Scripts>
</asp:ScriptManager>
<asp:ContentPlaceHolder ID="MainContent" runat="server">
</asp:ContentPlaceHolder>
I have found the problems.
The problem is the jquery code is on the masterpage, in the script manager, and script manager is in inside the body tag.
the document.ready is on the header tag on page that inherit on master page, so before the code to excuting to the body, the jquery is not included yet and that wat it is error.
The easiest way to solve this is, i have to move javascript code in the bottom of body tag. The proper way to solve, which i still can't find is to put the javascript include code in the header. but i don't find a way that work yet. My master page and inherit page is on the differnt path. I have find a lot of technique such as but none of them work.
Share Improve this question edited May 23, 2011 at 4:24 Sarawut Positwinyu asked May 23, 2011 at 2:51 Sarawut PositwinyuSarawut Positwinyu 5,04216 gold badges56 silver badges82 bronze badges 6- Yeah, you can, it's probably an issue with Visual Studio. – Rafe Kettler Commented May 23, 2011 at 2:54
- I think that error really means you haven't actually included the jquery library (in the above script includes). – Jared Farrish Commented May 23, 2011 at 2:54
- Actually i can use other javascript function function as identifier but i can't use $(document).ready – Sarawut Positwinyu Commented May 23, 2011 at 2:56
- 1 That doesn't make any sense. I think you need to post a jsfiddle that helps demonstrate what works and what doesn't. – Jared Farrish Commented May 23, 2011 at 2:57
- Visual Studio is probably the only issue, it also can't understand HTML5 tags and newer CSS3 properties and issues unnecessary warnings. But I wonder why it is happening as, when you create a new web application in Visual Web Developer (2010), it automatically creates "scripts" folder and adds JQuery library in there and includes it in every webpage you create, so it should understand what you're trying to do. – Kushal Commented May 23, 2011 at 3:01
2 Answers
Reset to default 3Take out all of the other javascript includes except for jquery-1.5.1.min.js. Try it with just that one include. If that works, add the other includes back in one at a time until you get the error. If it doesn't work with just the jQuery script included, chances are it's not pointing at the correct path.
Short answer though, yes, you can use jQuery and document.ready in an ASP.NET page.
Surely you can. Seems, however that jQuery object is not available at the moment of script execution. Verify that jquery library file is indeed loaded via script directive. Or maybe there are some other nuances behind this.