I have a page defined as:
<%# Page Language="C#" %>
<html>
<head>
<title>Untitled 1</title>
<script type="text/c#">
public void WriteHello()
{
Response.Write("HELLO EVERYBODY");
}
</script>
</head>
<body>
<div>
<% WriteHello(); %>
</div>
</body>
</html>
But this throws the compilation error of:
The name 'WriteHello' does not exist in the current context
If I move the C# code to a seperate file, and link to it, it works as expected. But for this I need to keep it in the same file. Can you not call inline methods like this? Or am I missing something very obvious?
The script tag you have coded is a client side script - it will try to execute on the browser. The code that tries to use it runs on the server.
You need to change the script to be server side script:
<script runat="server">
You can write this as:
<%
public void WriteHello()
{
Response.Write("HELLO EVERYBODY");
}
%>
Which is the syntax you used elsewhere already.
You are missing
<script runat=server type="text/c#">
You need to change it to
<script type="text/c#" runat="server">
Otherwise your code will not get compiled at runtime
Related
Currently I have the following code in Visual Studio asp.net. It seems like I'm making a new function in the head, while I want to use the one written in the aspx.cs file. The color is not working as I intended, but I'll get back to that.
It could look something like this:
//<script type="text/javascript" src='<%= Active_Frozen(string text, string color) %>'></script>
<head>
<script type="text/javascript">
function Active_Frozen(text,color)
{
document.write(text,color);
}
</script>
</head>
<body>
<script type="text/javascript">
Active_Frozen(text,color);
</script>
</body>
public Tuple<string,string> Active_Frozen(string text, string color) {
connection();
string query = "SELECT CustomerInfo FROM ActiveSubscription WHERE UserName=#UserName";
SqlCommand cmd = new SqlCommand(query, conn);
if(query=="true")
{
text = "Active";
color = "Green";
}
else
{
text = "Frozen";
color= "Red";
}
return Tuple.Create(text, color);
}
EDIT: The reason I have the code in my aspx.cs file is because HTML does not support string hence why it's needs to be amoung the server code. That's why I need to reach the function from the aspx file since I need the text to contain two different options.
Not that way, but you can ofcorse use that specific function in your aspx page, if you bring its implementation here (on aspx page). You can even have all the code in you aspx file. (kind of a single-file page). You Actually want to implement Embedded Code Blocks in ASP.NET Web Pages. Here's an example:
<%# Page Language="C#" %>
<script runat=server>
protected String GetTime()
{
return DateTime.Now.ToString("t");
}
</script>
<html>
<body>
<form id="form1" runat="server">
'Current server time is' <% =GetTime()%>.
</form>
</body>
</html>
But in general, using embedded code blocks for complex programming logic is not a best practice, because when the code is mixed on the page with markup, it can be difficult to debug and maintain. In addition, because the code is executed only during the page's render phase, you have substantially less flexibility than with code-behind or script-block code in scoping your code to the appropriate stage of page processing.
If you want to call code behind function from aspx, the class is public and the function is public static, and as long as you've imported the namespace in an <%# Import %> directive.
user server tag to call server side methods:
<body>
<% Active_Frozen(text,color); %>
</body>
I'm new to web development so I'm still learning the fundamentals.
I just want to add some jQuery to my ASP .NET page.
In the header, I reference what I need:
<head id="Head1" runat="server">
<link href="Content/Site.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="Scripts/jquery-2.0.2.js" ></script>
<script type="text/javascript" src="~/HeaderCheckBoxSelections.js"></script>
</head>
This is what the ~/HeaderCheckBoxSelections.js looks like:
function SelectAllCheckBoxes(cbSelect) {
$('#<%=gvShows.ClientID%>').find("input:checkbox").each(function() {
if (this != cbSelect) {
this.checked = cbSelect.checked;
}
});
}
The event is triggered by this:
<HeaderTemplate>
<asp:CheckBox ID="cbSelectAll" runat="server" onclick="javascript:SelectAllCheckBoxes(this);"/>
</HeaderTemplate>
But when the check box is clicked, it says:
Unhandled exception...
0x800a1391 - JavaScript runtime error: 'SelectAllCheckBoxes' is undefined.
Am I missing something here? Am I not referencing jQuery properly?
the databinding in the jquery selector in
$('#<%=grdOperation.ClientID%>')
won't work in a separate javascript file. That databinding has to be on the aspx markup to be rendered correctly.
You can either move that databinding into your aspx by storing it to a variable, such as
<head id="Head1" runat="server">
<link href="Content/Site.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="Scripts/jquery-2.0.2.js" ></script>
<script type="text/javascript" src="~/HeaderCheckBoxSelections.js"></script>
<script type="text/javascript">
var grdOperationId = '<%=grdOperation.ClientID%>';
</script>
</head>
and then referencing it by variable in your javascript.
Or you can use an "id ends with" selector to select it in the js code, as long as there is only one grdOperation on the page. Such as:
function SelectAllCheckBoxes(cbSelect) {
$('[id$=grdOperation]').find("input:checkbox").each(function() {
if (this != cbSelect) {
this.checked = cbSelect.checked;
}
});
}
Try this:
<HeaderTemplate>
<asp:CheckBox ID="cbSelectAll" runat="server" onclick="SelectAllCheckBoxes(this);"/>
</HeaderTemplate>
The ASP.NET Checkbox control does not actually have an OnClick attribute, nor an OnClientClick attribute; thus ASP.NET just passes the attribute on like a custom attribute and since a browser knows what to do with an onclick attribute it tries to execute the logic.
If this fails, then it is a problem with the actual .js file being loaded correctly. Can you verify with Chrome Developer Tools, Firebug or IE F12 Tools that the .js file is actually in memory?
Here is a screenshot of Chrome Developer Tools filtering out just the Scripts, in the Network tab, upon going to Microsoft's web site:
This may be a newbie question, but i'm pretty new to asp.net & C# etc.
I'm working with an ASP.net website, and I'm curious about the structure of it (after automatically creating a web project), specifically the following:
I see that in Default.aspx , I have a tag like this:
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
</asp:Content>**strong text**
But in Site.master, I have this:
<head runat="server">
*etc*
</head>
So where would I put code if I wanted to include JavaScript code to run, on page load?
I believe you can put your code in any of them. The first one is for adding code or script used by all content pages(that using this master page file) while the second one is if you want to to add script or code from content pages(that should be used only for this specific page)
//in the Master page, the content here is used by all content pages
<head runat="server">
*etc*
</head>
and
//this is specific to the content page that use it. This section needs to be supplied in content pages
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
</asp:Content>
That section needs to be supplied in each content page and it will be exclusive to that page - no other page can use the script in that section
asp:Content ID="HeaderContent" is a content region. Anything within that tag will get embedded in the associated ContentPlaceHolder in the master page when it is generated.
head is a standard html markup, indicating the page head elements. Typically, the HeadContent placeholder is inside the head tag on the master page.
The head element, container for all the head elements, must use a title for the document. Some other elements it can include: style, base, link, meta, script, noscript.
The asp: Content ID = "HeaderContent" is a content element of the master page.
Have a look at the Plugging in Content part of the following link for detailed information on this: http://odetocode.com/articles/419.aspx
I think you asked when you want to use JavaScript where you put JS in your code.You can put anywhere you wish in asp side between script block such as:
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<script type="text/javascript">
function Onclick(){
//some codes
}
</script>
</asp:Content>
or
<head runat="server">
<script type="text/javascript">
function Onclick(){
//some codes
}
</script>
</head>
Also you can put JS outside this tag. You only should use tag.
I have made this example and it works fine on a plain aspx webpage. I use Visual Studio 2010.
Head-part:
<title>Show/hide element</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#CheckBoxShowHide').click(function () {
$("#ShowHideElement").slideToggle();
});
});
</script>
<style type="text/css">
#ShowHideElement
{
width:400px;
height:100px;
background-color:Aqua;
}
</style>
Body-part:
<form id="form1" runat="server">
<asp:CheckBox ID="CheckBoxShowHide" runat="server" Text="Show/hide" />
<div id="ShowHideElement">
This is the element for show/hide
</div>
</form>
When I have a masterpage and the same code on the child webpage JQuery dosent work. The loading of the JQuery javascript file fails. The child page and the masterpage are in the same folder. If I put the code on the masterpage it works fine but I want JQuery on the child page too. Please help me.
I can see another problem as well, you are trying to grab the checkbox ID based on its server ID not ClientID. Once a asp control has been rendered onto the client its ID gets changed. Try the following code:
<title>Show/hide element</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#<%=CheckBoxShowHide.ClientID%>').click(function () {
$("#ShowHideElement").slideToggle();
});
});
</script>
<style type="text/css">
#ShowHideElement
{
width:400px;
height:100px;
background-color:Aqua;
}
</style>
Body-part:
<form id="form1" runat="server">
<asp:CheckBox ID="CheckBoxShowHide" runat="server" Text="Show/hide" />
<div id="ShowHideElement">
This is the element for show/hide
</div>
</form>
The following line is the only thing I changed:
$('#<%=CheckBoxShowHide.ClientID%>').click(function () {
Hope it helps.
Are you sure your page is loading jQuery, use a absolute URL in your master page to reference the jQuery library.
If jQuery is on your masterpage, it will work on your child page.
Master <head>
<head>
<script type="text/javascript" src="js/jquery.js"></script>
</head>
Child <head>
<head>
<script type="text/javascript">
$(document).ready(function () {
//Do Child jQuery Stuff here....
});
</script>
<head>
If you are having issues the only other thing to check is to make sure that your path to the jquery file is right. (ie Maybe it should be ../js/jquery.js)
Use this to make sure that isn't the issue if the other thing I suggested doesn't work:
For your Master Page <head>:
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
</head>
Or (if you want to host it)
<head>
<script type="text/javascript" src='<%=ResolveURL("~/js/jquery.js")%>'></script>
</head>
Where ~/ is your root.
You should be able to just place the link to the JQuery library in the HEAD section of the master page. When the page is ran it will generate the HTML content for the master page with the link in the HEAD section, the content page should be able to then make user of the JQuery library. I know we had an issue with how the link was being done. Maybe try linking in the HEAD of the master page like this instead:
<script type="text/javascript" src='<% = ResolveURL("~/js/jquery.js") %>' ></script>
The '<% %>' is a way to do inline server side code as the page loads, so the page will inject the correct src given the location of the URL.
I work on a ASP.NET application using Jquery. Jquery is really powerfull and I use a lot of it.
In my master page I include all libraries I use and a js file who contain the jquery code available for all the application (interface interactions). In this js File (Main.js) I make some things so I use the $(document).ready( ... etc .. )
But in some pages, who are more complex I need to use some other jquery code.. So I add some head Content with other script tag.. And this the problem, I have to add the $(document).ready() instruction again.
There is a lot of problems with my asp controls with this way to do, the autopostback controls doesn't do their autopostback.. I think this is a problem with the multiple $(document).ready() declaration because when I remove the second one(in the page not in the master page) the controls are working.
So how can I do to add some javascript code in a specific page without multiple $(document).ready() declaration. (I don't want to embed all the jquery code in all pages).
I hope I'm clear enough, thanks for responses
Edit here is code
Master page part
<%# Master Language="C#" AutoEventWireup="true" CodeBehind="Site.master.cs" Inherits="SiteMaster" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<link href="~/Styles/Site.css" rel="stylesheet" type="text/css" />
<link href="Styles/jquery-ui-1.8.9.custom.css" rel="stylesheet" type="text/css" />
<link href="Styles/menu.css" rel="stylesheet" type="text/css" />
<script src="/js/jquery-1.4.4.min.js" type="text/javascript"></script>
<script src="/js/jquery-ui-1.8.7.custom.min.js" type="text/javascript"></script>
<script src="/js/jquery.cookie.js" type="text/javascript"></script>
<script src="/js/jquery.ui.datepicker-fr.js" type="text/javascript"></script>
<script src="/js/jquery.color.js" type="text/javascript"></script>
<script src="/js/Menu.js" type="text/javascript"></script>
<script src="/js/iphone-style-checkboxes.js" type="text/javascript"></script>
<script src="/js/jquery.tools.min.js" type="text/javascript"></script>
<script src="/js/Main.js" type="text/javascript"></script>
<asp:ContentPlaceHolder ID="HeadContent" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
Some content....
</body>
</html>
Main.js
$(document).ready(function () {
/// <reference path="jquery-1.4.4-vsdoc.js" />
//There is a lot of content here......
});
And A page
<%# Page MasterPageFile="~/Site.master" Language="C#" AutoEventWireup="true" CodeBehind="Dep.aspx.cs" Inherits="Dep" %>
<asp:Content ID="HeadContent1" ContentPlaceHolderID="HeadContent" runat="server">
<link href="../../Styles/nyroModal.css" rel="stylesheet" type="text/css" />
<script src="../../js/jquery.nyroModal.custom.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#tbxDateDebut').datepicker();
$('#tbxDateFin').datepicker();
$('.nyroModal').nyroModal();
});
</script>
</asp:Content>
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
//Here comes the controls... (lot of code)
</asp:Content>
main.js
$(document).ready(function () {
//There is a lot of content here......
if ($.pageReady) $.pageReady($);
});
page.js
<script type="text/javascript">
$.pageReady = function() {
// fired on DOM ready
}
</script>
The answer is in your question:
But in some pages, who are more complex I need to use some other jquery code.. So I add some head Content with other script tag.. And this the problem, I have to add the $(document).ready() instruction again.
"But in some pages..."
Unfortunately you have to add a reference for every js file that refers to uncommon elements. That is if you have page 1 with a <div id="element1"> and another page (page 2) with <div id="element676"> you would not want to include all in the Jquery handling into Main.js . In fact that would give an error if you had not yet seen page 2.
Damn you guys are quick.... as I was writing #Raynos gave the correct answer.
well an alternative is to move all of you jquery document ready to the bottom of your page
<body>
... here goes your other html ....
<script>
//$(document).ready(function(){//this is not needed
... here goes the first ready...
//});//this is not needed
//$(document).ready(function(){//this is not needed
... here goes the second ready ... and so on...
//});//this is not needed
</script>
</body>
So in effect you are using document.ready when all other elements are ready :) PS
I'm inclined to think that there's something at work here other than your multiple $(document).ready() calls. AFAIK, multiple calls against $(document).ready() (and even bubbled-up versions, like $('#someid').ready()) shouldn't cause issues as they are all aggregated together silently by jQuery for you.
I'd double-check my syntax for starters, and make sure that all your blocks are properly encapsulated, all statements end with a ;, and all that jazz.