asp .net jquery - asp.net

I am new to asp .net. I am trying to use the JQuery library scripts. So included them in my aspx page as follows
<script src="<%= Page.ResolveClientUrl("~/jquery-1.3.2.js")%>" type="text/javascript"></script>
<script src="<%= Page.ResolveClientUrl("~/jquery.validate.js")%>" type="text/javascript"></script>
<script src="<%= Page.ResolveClientUrl("~/jquery.form.js")%>" type="text/javascript"></script>
I just wrote the sample code to test the alert message.
<script language="javascript" type="text/javascript">
$(document).ready(function() {
alert('hi');
});
</script>
I did not get any error when the page loaded but the alert message is not displayed. I hope I have got all the files necessary for using jquery. But I dont know why the alert message does not display. Any thoughts or comments?

You need to do the following then for each file:
<script src='<%= Page.ResolveClientUrl("~/scripts/jquery/a-jquery-file.js")%>'
type='text/javascript'></script>
~/ indicates the root of the folder, so you need the additional folder structure.

Related

Two types of jquery ui referencing gets different results

If I add jquery ui reference as
<script src="/_Docs/_Altyapi/JqueryUi/jquery-ui.1.8.21.min.js" type="text/javascript"></script>
then tagit editor works fine(just under tag editor input), like:
But, if I use references like
<script src="/_Docs/_Altyapi/JqueryUi/ui/jquery.ui.core.min.js" type="text/javascript"></script>
<script src="/_Docs/_Altyapi/JqueryUi/ui/jquery.ui.widget.min.js" type="text/javascript"></script>
<script src="/_Docs/_Altyapi/JqueryUi/ui/jquery.ui.autocomplete.min.js" type="text/javascript"></script>
then, it doesn't work(as can be seen in photo2, custom autocomplete is at the top of page), like:
Include the position JS file as well to get autocomplete to work. Probably:
<script src="/_Docs/_Altyapi/JqueryUi/ui/jquery.ui.position.min.js" type="text/javascript"></script>
For future reference, you can always go to the widget's documentation page under overview and you'll see the dependencies for the widget.

ASP.NET jQuery Datepicker Issue - What am I missing?

This was working on Friday, and now isn't. I've got this at the beginning of a UserControl:
<link type="text/css" href="/App_Themes/css/ui-lightness/jquery-ui-1.8.11.custom.css" rel="stylesheet" />
<script src="/Scripts/jquery-1.5.1.min.js" type="text/javascript"></script>
<script src="/Scripts/jquery-ui-1.8.11.custom.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#MainContent_ucSearchControl_dpPickupStart").datepicker();
$("#MainContent_ucSearchControl_dpPickupEnd").datepicker();
});
</script>
And further down, this:
<td><asp:TextBox id="dpPickupStart" runat="server" style="width: 65px"/></td>
<td><asp:TextBox id="dpPickupEnd" runat="server" style="width: 65px"/></td>
Which results in (in the rendered page) input controls with:
name="ctl00$ctl00$MainContent$ucSearchControl$dpPickupStart" id="MainContent_ucSearchControl_dpPickupStart"
name="ctl00$ctl00$MainContent$ucSearchControl$dpPickupEnd" id="MainContent_ucSearchControl_dpPickupEnd"
And yet, every time the page loads, I get an Object Expected javascript error which points to the $(document).ready location.
What am I missing?
EDIT: Firebug is reporting that:
$ is not defined
[Break On This Error] $(document).ready(function () {
Being a user control you cannot guarantee that the relative path to your JS files will always be correct depending on the location of the parent page in the file system hierarchy.
Therefore change you JS script tags as follows to use the Control.ResolveUrl method which converts a URL into one that is usable on the requesting client.
<script src='<%=ResolveUrl("~/Scripts/jquery-1.5.1.min.js")%>' type="text/javascript"></script>
<script src='<%=ResolveUrl("~/Scripts/jquery-ui-1.8.11.custom.min.js")%>' type="text/javascript"></script>
Or reference from a CDN for added performace bonus of caching.
jQuery hosted on google
jQuery UI hosted on google
That error is caused due to Jquery not available. I think Swaff's solution should work(+1). Check if you have the Jquery-1.5.1.min.js file is available in Scripts folder of your solution. Or it could also be that your Scripts folder is renamed.
HTH.

jQuery object expected error in asp.net page with master site

The error i get seems to be centered around jquery finding what it's in (window,document, etc.). Right now i'm just trying to implement the jQuery datepicker. the project has a master page, where i placed my script references.
<head runat="server">
<title></title>
<link href="~/Styles/Site.css" rel="stylesheet" type="text/css" />
<link href="Styles/jquery-ui-1.8.5.custom.css" rel="Stylesheet" type="text/css" />
<script type="text/javascript" src="Scripts/jquery-1.4.1.min.js"></script>
<script type="text/javascript" src="Scripts/jquery.datePicker.js"></script>
<script type="text/javascript" src="Scripts/date.js"></script>
<asp:ContentPlaceHolder ID="HeadContent" runat="server">
</asp:ContentPlaceHolder>
</head>
in my aspx file for the page i am trying to implement the date picker, the code looks like this.
i placed this in the header place holder
<script type="text/javascript" charset="utf-8">
$(window).ready(function () {
$("#<%=this.tbTestPass.ClientID %>").datePicker();
});
</script>
This is the asp control i am trying to apply the datepicker to.
<asp:TextBox ID="tbTestPass" runat="server" Width="120px"></asp:TextBox>
I have tried document and window for jquery context, but they both throw the same error. What noob mistake am i making?
Verify Jquery(.js) file folder path is resolved properly from the application as well as in the IIS.
i had the same situation, i had Jquery.js file under Scripts folder(Scripts/Jquery.js).
but when i went to iis, i am not able to see the Scripts folder.
later i came to know there there is an Script virtual directory in IIS when is taking precedence over the local Script folder.
found that linking to http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js fixed the object missing. pointing to a local file was not working. not sure why, but this will do and suit my needs i think.

How can i use js files in master pages?

i have a master page. i try to add js files. vs editor is not draw green color. But no affect my pages with js. i can not use below js. How can i write src? (i can use pickurl) but i don't see effects of js on page
<script src="Engineering/EngDynamicsCreationExcel/EngJs/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="../Engineering/EngDynamicsCreationExcel/EngJs/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="../../Engineering/EngDynamicsCreationExcel/EngJs/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="~/Engineering/EngDynamicsCreationExcel/EngJs/jquery-1.3.2.min.js" type="text/javascript"></script>
i added my js files pic below. Also i have a MasterPage in MroTechnic
I would make use of ResolveURL:
<script type="text/javascript" src="<%= ResolveUrl("~/Engineering/EngDynamicsCreationExcel/EngJs/jquery-1.3.2.min.js") %>"></script>
Probably the problem is that your actual pages have different path than the master page which makes the path invalid. One solution would be to use ScriptManager and load the scripts with relative paths.

Can't find my functions?

I've been trying to find out what's going on with my page for more than an hour.. What I'm trying to do here is to call a javascript function when the page loads, but for some reason it says "object required" then its pointing to my onload event in the body tag. This is what I have..
<head id="Head1" runat="server">
<!-- JAVASCRIPT -->
<script src="JScript/jquery-1.2.6.pack.js" language="javascript" type="text/javascript"></script>
<script src="JScript/stepcarousel.js" language="javascript" type="text/javascript"></script>
<script src="JScript/Carousel.js" language="javascript" type="text/javascript"></script>
<script src="JScript/TopNav.js" language="javascript" type="text/javascript"></script>
<!-- CSS -->
<link href="Style/audiorage.css" rel="stylesheet" type="text/css" />
<link href="Style/carousel.css" rel="stylesheet" type="text/css" />
<link href="Style/tabs.css" rel="stylesheet" type="text/css" />
<title>Audio Rage - Home</title>
</head>
<body onload="javascript:TopNavPageInitialize();">
<form id="form1" runat="server">
<!-- HIDDENFIELDS & SCRIPTS -->
<input type="hidden" value="Main Navigation" id="hdnTabActiveOnLoad" />
and I have this files in this structure
localhost/mytest/JScript/jquery-1.2.6.pack.js
localhost/mytest/JScript/stepcarousel.js
localhost/mytest/JScript/Carousel.js
localhost/mytest/JScript/TopNav.js
localhost/mytest/mypage.aspx
My TopNav.JS has this function
function TopNavPageInitialize()
I also get "Unexpected call to method or property access." in my carousel but I'm not really worried about it I think if I can fix this maybe that 2nd error that I'm getting can be fixed. Thanks!
I'm confused. What am I missing. Thanks.
Since you're using jQuery:
$(document).ready(function(){
// Your code here
});
use that or
$(window).load(function () {
// run code
});
that--depending on what you're going for.
Ready just means the dom is ready but images aren't loaded. Load means everything is done loading.
Of course, it sounds like you've got other issues. But this is a much better option than using inline onload events.
like?
$(window).load(function() {
alert('x');
});
$(window).load(function funcName() {
alert('x');
});
both says object expected
It looks to me like your scripts aren't loading properly.
To really see what's going on use either Firebug in Firefox, or the developer tools (press F12) in IE8. (If you're still using IE7/6 google IE Developer Toolbar - it will be a start).
Once you're using one of those, you can then see what scripts are being loaded, or whether you're getting 404's or similar for them.
Also, as an aside, you don't need the
language="javascript"
attributes any more.

Resources