We Keep Coding

js file and css files are not loaded correctly after the url routing in asp.net webforms

I am trying to implement the urlrouting for asp.net webforms. My problem is all the js file and the css files not loaded on the page because it cannot refer to the correct path.
I've refer the js on the my master page as shown below.
<script type="text/javascript" src="Scripts/jquery-1.7.1.min.js" charset="utf-8"></script>
<script type="text/javascript" src="~/Scripts/jquery-1.7.1.min.js" charset="utf-8"></script>
Could you please help me for a solution.

you can use the Page.ResolveUrl(String relativeUrl)
Page.ResolveUrl("...") will generate an absolute path out of an relative one:
<script type="text/javascript" src='#Page.ResolveUrl("~/Scripts/jquery-1.7.1.min.js")' charset="utf-8"></script>
or
<script type="text/javascript" src='<%= Page.ResolveUrl("~/Scripts/jquery-1.7.1.min.js")%>' charset="utf-8"></script>
depending on if you're using razor markup or not.

This is the correct format to call your JQuery script with. The '~' refers to the root directory. So assuming your script is in this location, it should work.
<script type="text/javascript" src="~/Scripts/jquery-1.7.1.min.js" charset="utf-8"></script>
However, the line above it attempts to load the same script, but does not include the '~' character.
<script type="text/javascript" src="Scripts/jquery-1.7.1.min.js" charset="utf-8"></script>
...and you aren't attempting loading any CSS files. So delete the first line, and then add the correct tags to load your CSS files.
<link rel="stylesheet" type="text/css" href="~/Content/mystyle.css">

Only use / Because it means root of the site. (if Scripts dir under your root)
<script type="text/javascript" src="/Scripts/jquery-1.7.1.min.js" charset="utf-8"></script>

Relative Path for reference files

I am developing an app in asp.net in which I am referring script and style files. My Default Page is at root and other pages are in folders. I refer these links on master page.
<link href="~/Styles/bootstrap.css" rel="stylesheet" type="text/css" />
<script src="Scripts/bootstrap.js" type="text/javascript"></script>
On default page links are working fine but in other pages its not working. Provide a middle way

You can use the Page.ResolveUrl in combination with the ~ (tilde) character for identifying the web page root:
<script src="<%= Page.ResolveUrl("~/Scripts/bootstrap.js") %>" type="text/javascript"></script>
Will resolve at runtime to
<script src="<your page root>/Scripts/bootstrap.js" type="text/javascript"></script>
Note that you can't use this in the section of a web page, because it will throw an "The Controls collection cannot be modified" exception. You can get around this by either changing the script tag to a server control and setting the path in code-behind, or moving the script and style tags out of the header into the page body.

As Archer said prefix js link with '/' if your script folder is in root
<script src="/Scripts/bootstrap.js" type="text/javascript"></script>
this will work fine for nested directories as well.

registering jquery in asp.net Master page

I have asp.net web project with following folder structure
MyProject
-FolderOne
-PageOne.aspx
-FolderTwo
-PageTwo.aspx
-HomePage.aspx
-Site.Master
I registered <script type="text/javascript" src="Scripts/jquery-1.4.1.js"></script> in Site.Master . My Problem is that , function using this jquery works in HomePage.aspx but not in PageOne.aspx and PageTwo.aspx .
But it's works when i register <script type="text/javascript" src="../Scripts/jquery-1.4.1.js"></script> in each PageOne.aspx and PageTwo.aspx . Is there any way if I want to register my script only in Site.Master ?

Sorry my earlier solution assumed that it was an MVC project.
You need to use ResolveUrl in Site.Master so that PageOne & PageTwo work properly
<script type="text/javascript" src='<%= ResolveUrl("~/Scripts/jquery-1.4.1.js")%>'></script>

PageOne and PageTwo must refer to the master page in order to get access to the includes in the master page. Otherwise they need their own local includes

JavaScript works locally but not when deployed to webserver

I'm deploying some code to a website and when I do the JavaScript does not run. I get the error:
SCRIPT5007: The value of the property '$' is null or undefined, not a Function object.
The code it is using is
#model MVCMasterDetail.DataAccess.cwwoLoadCurrentWorkOrderActualsResult[]
<script type="text/javascript">
$(document).ready(function () {
$(".grid-toggle").click(function () {
$(this).closest("table").find("tbody").show();
});
$(".hide-rows").click(function () {
$(this).closest("table").find("tbody").hide();
});
});
</script>
#Html.Partial("MasterDetailMasterPartial")
And what calls uses it is:
<td colspan="4"> Details<br/>Show- Hide</td>
Any help is appreciated.

Based off your comment in Ashley Ross's answer, it looks like your trying to add jQuery using a relative path. it also looks like you're using MVC. In MVC, the way you want to reference a file in html is:
<script src="#Url.Content("~/Scripts/jquery-1.7.1.js")"></script>
Also, it doesn't matter if your script tag goes in the head tag or not. The only difference it makes is loading. By putting it in the head tag, you're telling the browser to download the js file before it begins to load the body, which can be nice, but can also increase page load times. For faster page download, you actually want to put your script tags towards the bottom of your body tag, which defers downloading the js file until after the rest of the page has loaded. This results in faster page load times, but can cause some funky behaviors if you aren't anticipating it.

You need to include jQuery before any other scripts. It sounds like you have something like
<script type="text/javascript" src="customScriptThatUsesjQuery.js"></script>
<script type="text/javascript" src="jquery-x.y.z.min.js"></script>
instead of
<script type="text/javascript" src="jquery-x.y.z.min.js"></script>
<script type="text/javascript" src="customScriptThatUsesjQuery.js"></script>
Check that it appears in your HTML source before any other scripts that use it.

you have to add reference to jquery lib in <head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>

ASP.NET MVC2: Client-side validation not working with Start.js

Ok, this is strange. I would hope it's something I'm doing wrong and not that MS has two technologies that simply don't work together. (UPDATE: See bottom of post for Script tag order in HEAD section)
I'm trying to use the dataView template and client-side validation. If I include a reference to:
<script src="http://ajax.microsoft.com/ajax/beta/0911/Start.js" type="text/javascript"></script>
by itself, the dataview template works fine. but if I put in the following references:
<script src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.min.js" type="text/javascript"></script>
<script src="../../Scripts/MicrosoftAjax.js" type="text/javascript"></script>
<script src="../../Scripts/MicrosoftMvcAjax.js" type="text/javascript"></script>
<script src="../../Scripts/MicrosoftMvcValidation.js" type="text/javascript"></script>
then I get the following error:
> Error: Type._registerScript is not a
> function Source File:
> http://ajax.microsoft.com/ajax/beta/0911/MicrosoftAjaxTemplates.js
> Line: 1
and:
> Error: Sys.get("$listings") is null
> Source File:
> http://localhost:12370/Listings Line:
> 76
Here's the code calling the dataview:
$(document).ready(function () {
LoadMap();
Sys.require([Sys.components.dataView, Sys.scripts.jQuery], function() {
$("#listings").dataView();
Sys.get("$listings").set_data(listings.Data);
updateMap(listings.Data);
});
});
I would really appreciate any help with this one.
Thanks!
UPDATE:
I've tried moving around the order of the last 4 script tags, but to no avail.

You need to ensure that your reference to "jquery.validate.min.js" is AFTER your reference to "jquery.min.js" (or whatever version of the jQuery library you are using). You haven't listed that in your code sample.

Well, I ended up getting jquery validation to work and it doesn't have any conflicts with Start.js. So my script tags end up looking like such:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.0/jquery-ui.min.js" type="text/javascript"></script>
<script src="http://ajax.microsoft.com/ajax/beta/0911/Start.js" type="text/javascript"></script>
<script src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.min.js" type="text/javascript"></script>
<script src="/Scripts/MicrosoftMvcJQueryValidation.js" type="text/javascript"></script>
The strange thing is, I had to go find the MicrosoftMvcJQueryValidation.js file on the web in someone's example, as it wasn't included in the Scripts folder when I created the solution. Strange.