Add .js files at the bottom of the page from User Control - asp.net

I have a user control on my web forms app and I need to reference a js file on the user control.
I would like to add this js file at the bottom of the output html page but I don't know how to do it from User Control.
I have following script references on my master page;
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.2.min.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.12/jquery-ui.min.js"></script>
<script src="http://ajax.cdnjs.com/ajax/libs/modernizr/1.7/modernizr-1.7.min.js" type="text/javascript"></script>
and they are staying just after the </body> tag at the bottom. I'm using my user control like below on a web form page;
<userControl:SearchEngine ID="SearchEngine" runat="server"></userControl:SearchEngine>
and from this user control, I would like to add the a js at the bottom of the outputted html markup after the 3rd js file which you can see above.
any idea?

Try using RegisterClientStartUpScript() method to inject it at the end of the page:
http://msdn.microsoft.com/en-us/library/aa478975.aspx#aspnet-injectclientsidesc_topic2

Add a literal control at the bottom and set its text property with the content of the javascript file.

Related

How to get the text from an link on the master page?

I have a master page with a few links on it, not asp:Hyperlinks, just normal tags. The links are on a menu bar that runs along the top of the page.
Then on the child page, when I click a button, I want to be able to get the value of a specific link on the menu bar at the top of the screen on the code behind page.
Does anyone know if I can do this, and if so, how?
I'm using .net web forms.
You can use jQuery to access elements within the master page.
<script>
$(document).ready(function () {
//Some function for someID on your master page:
$("#someID").toggle();
});
</script>
Since the master page and child pages are rendered before the (document).ready method completes, it ensures that all elements built onto the final page are visible.
Placing the above script into your child page will allow you to access elements in the master page file.
You will just need to ensure you have a jQuery link/reference:
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js">
</script>
</head>
EDIT #1:
For getting the text off the master page into the code-behind of the child page you can do this (add hidden field to child page):
<asp:HiddenField ID="hdField" Value="SomeValue" runat="server" />
<script>
$(document).ready(function () {
//Some function for someID on your master page:
$("#hdField").value = ("#IDofLinkOnMasterPage").Value;
});
</script>
Then when your form posts to the child code-behind, you can look for the value of the hidden field by doing this:
var x = hdField.Value.ToString();

How to make script paths inside user control independent of page hierarchy

My website is organized in the following folder structure
Root
Pages
CustomerManagement
DepartMentManagement
Script
UserControls
Now i have a user control inside userControl Folder. I have to use a external js file. So i use it this way
<script type="text/javascript" language="javascript" src="../Script/slider.js"></script>
My understanding is that since both are under root so i have used a single ..
Now what happens is that when this usercontrol is used inside DepartMentManagement it checks for script folder inside CustomerManagement as .. refers to one hierarchy above and script file is not found.Even using a ~ doesnot work.
I want to make this script path independent of the path where this control is used. I don't want to move script reference code to the page as control requires script mot page.Please tell me how to achieve this.
Try it like this
<script type="text/javascript" language="javascript" src="<%= ResolveUrl("~/Script/slider.js") %>" ></script>

registering a javascript file from a master page

Is there any reason why registering a javascript file from the head tags of an ASP.NET master page wouldn't work? For example, I have the following (plus many other) file referece:
<script type="text/javascript" src="/js/jquery/jquery-1.4.2.min.js"></script>
but jquery (and every other JS reference) doesn't work when the page loads.
Any thoughts? Thanks.
The src attribute is relative, try
<script type="text/javascript" src="/js/jquery/jquery-1.4.2.min.js"></script>
and see if that fixes your problem
If that doesn't work, you can try this:
<script type="text/javascript" src="<%# ResolveUrl("~/js/jquery/jquery-1.4.2.min.js") %>"></script>
and in your Page Load handler in the master page add this code:
Page.Header.DataBind();
The masterpage can have script resources just like a normal HTML page; you'll probably want to check the problem with an HTTP debugger like FireBug or Fiddler2, if phsr is correct you'll see the requests failing with an ErrorCode.
Using master pages will not affect the loading of JavaScript files. Your problem is either the location of the file or the script tag is formatted incorrectly.

How send parameters with javascript tag?

How can I send parameters (with QueryString) within a javascript tag as the source attribute to a ASP.NET page?
Example: <script language="javascript" src="myDomain/myPage.aspx?id=123&no=43"></script>
And what I have to do in "myPage.aspx"?
For example I want to send a picture to the script tag according to it's src querystring.
The script tag is used to include javascript code in the page. If you want to show an image on the page, even one generated dynamically, you want to use an img tag, not a script tag.
<img src="myDomain/myPage.aspx?id=123&no=43" alt="some text" />
Normally, you'd use an HttpHandler for this (ashx instead of aspx) and it would simply need to construct the image (or read it from a file) and then send the data down in the response with the correct MIME-type, length, etc.
See this reference on how to retrieve images from a DB using an HttpHandler.
It's not clear what you intend to do in your myPage.aspx. Since it is a script tag, it should be generating javascript code. But I don't see any reason why you'd need to dynamically generate your javascript code. Javascript variables basically have global scope, so define the image in a variable before including the script tag.
So in your html page you would do something like this in your header:
<script type="text/javascript">
var imageURL = 'http://www.google.com/intl/en_ALL/images/logo.gif';
</script>
<script src="myScript.js" type="text/javascript"></script>
And then in myScript.js:
alert("The image URL is: " + imageURL);
//do whatever processing with the image that you need to do...
Google Analytics used to work like this (before they went to a more object-oriented approach).
Why would you send a picture to a script tag? Basically what you have will work client side. In MYPage.aspx you need to output what you want to send.
I'd recommend using an HttpHandler which is a great to dynamically provide things like CSS, Javascript or images
Asp.net System.Web.HttpContext.Current.Session null in global.asax
What's the best way to display an image from a sql server database in asp.net?
All you have to do is give your <SCRIPT> tag a SRC attribute pointing to an ASPX page, just like you wanted. The only trick is that you have to have the ASPX page that returns javascript set the contentType to text/javascript. (Make sure it sends back only valid javascript.)
Here are two files to prove that it works:
JavascriptLibraryTester.aspx
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<script src="JavascriptLibraryTest.js.aspx?Color=red" type="text/javascript" charset="utf-8">
</script>
</head>
<body>
show Server Generated Javascript
</body>
JavascriptLibraryTest.js.aspx
<%# Page Language="C#" %>
<%
Response.ContentType = "text/javascript";
string color = Request["Color"];
string now = DateTime.Now.ToString();
%>
function showServerGeneratedJavascript(){
alert('<%=now %>\n<%=color %>');
}

Usercontrol access Javascript from a Content's Page's Master Page

Hello all I have a problem. I have a masterpage that all of my Content pages inherit from. Within this masterpage I have a script tag pointing to the Javascript file folder ~/Scripts/validation.js
On my content pages I use different usercontrols that require the use of many of the functions within the validation.js file however if I dont put the <script> tag and the Javascript functions within a contentholder on the contentpage the usercontrols do not see these functions and I get errors like OnNameValidation is not defined.
Of course I can copy the Javascript code into all of the pages but that's 30+ pages and a maintenance nightmare if I find a bug in one of the Javascript functions.
So the question (if you haven't already figured out from my long dissertation) is how can I declare the script tag with the path to the validation.js file so that contentpages and their usercontrols etc. can access the functions/code.
What you are trying to do should work, so I suspect that the path to your javascript file is wrong (without seeing your html code I can only assume). Keep in mind that you can only reference the javascript file like this: "~/Scripts/validation.js" if you have the link in a HEAD runat="server" tag. Without the runat="server" it won't find the file. You would have to do something like "../scripts/validation.js"
As a test I would try to call your javascript function in the masterpage, so you can rule out a bad file reference.
I picked up this tip from ScottGu here.
Add this to you user control which enables Intellisense in user controls but always evaluates false:
<% if (false) { %>
<script src="/Scripts/validation.js" type="text/javascript"></script>
<% } %>
I am currently doing this in my site by going to the Source code on the master page and putting the following in the head and outside of the ContentPlaceHolder.
<head>
<asp:ContentPlaceHolder ID="HeadContent" runat="server">
</asp:ContentPlaceHolder>
<script src="CP.js" type="text/javascript"></script>
</head>
The path you are assigning for your js file is probably not matching in all the pages.
script src="../JavaScript/Scriptaculous/scriptaculous.js"
It should have something like above this if you have separate folder for Scripts, MasterPages, Pages & Controls.

Resources