Problem :
I would like to call a javascript function from an aspx control. For instance, suppose I had:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
<script type="text/javascript">
function test(x, y)
{
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Button ID="Button1" runat="server" Text="Button"
onclick="Button1_Click"/>
</div>
</form>
</body>
</html>
and in the code behind:
protected void Button1_Click(object sender, EventArgs e)
{
// do stuff (really going to a database to fill x and y)
int[] x = new int[] { 1, 2, 3, 4, 5 };
int[] y = new int[] { 1, 2, 3, 4, 5 };
// call javascript function as test(x,y);
}
Is there a way to do it?
Solution :
You can use the Page.ClientScript.RegisterStartupScript method.
Look at the ScriptManager.RegisterStartupScript method if you’re using a ScriptManager or any Ajax controls/asynchronous postbacks.
Edit:
Actually, the function you want is probably ScriptManager.RegisterClientScriptBlock
Some other things I found out:
You can’t directly pass in an array like:
this.Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "xx",
"<script>test("+x+","+y+");</script>");
because that calls the ToString() methods of x and y, which returns “System.Int32[]”, and obviously Javascript can’t use that. I had to pass in the arrays as strings, like “[1,2,3,4,5]”, so I wrote a helper method to do the conversion.
Also, there is a difference between this.Page.ClientScript.RegisterStartupScript() and this.Page.ClientScript.RegisterClientScriptBlock() – the former places the script at the bottom of the page, which I need in order to be able to access the controls (like with document.getElementByID). RegisterClientScriptBlock() is executed before the tags are rendered, so I actually get a Javascript error if I use that method.
http://www.wrox.com/WileyCDA/Section/Manipulating-ASP-NET-Pages-and-Server-Controls-with-JavaScript.id-310803.html covers the difference between the two pretty well.
Here’s the complete example I came up with:
// code behind
protected void Button1_Click(object sender, EventArgs e)
{
int[] x = new int[] { 1, 2, 3, 4, 5 };
int[] y = new int[] { 1, 2, 3, 4, 5 };
string xStr = getArrayString(x); // converts {1,2,3,4,5} to [1,2,3,4,5]
string yStr = getArrayString(y);
string script = String.Format("test({0},{1})", xStr, yStr);
this.Page.ClientScript.RegisterStartupScript(this.GetType(),
"testFunction", script, true);
//this.Page.ClientScript.RegisterClientScriptBlock(this.GetType(),
//"testFunction", script, true); // different result
}
private string getArrayString(int[] array)
{
StringBuilder sb = new StringBuilder();
for (int i = 0; i < array.Length; i++)
{
sb.Append(array[i] + ",");
}
string arrayStr = string.Format("[{0}]", sb.ToString().TrimEnd(','));
return arrayStr;
}
//aspx page
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
<script type="text/javascript">
function test(x, y)
{
var text1 = document.getElementById("text1")
for(var i = 0; i<x.length; i++)
{
text1.innerText += x[i]; // prints 12345
}
text1.innerText += "ny: " + y; // prints y: 1,2,3,4,5
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Button ID="Button1" runat="server" Text="Button"
onclick="Button1_Click" />
</div>
<div id ="text1">
</div>
</form>
</body>
</html>
include script manager
code behind function
ScriptManager.RegisterStartupScript(this, this.GetType(), "HideConfirmBox", "javascript:HideAAConfirmBox(); ", true);
Response.Write("<scrip" + "t>test(" + x + "," + y + ");</script>");
breaking up the script keyword because VStudio / asp.net compiler doesn’t like it
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Call java script function on Code behind</title>
<script type="text/javascript">
function abc()
{
var a=20;
var b=30;
alert("you enter"+a+":"+b);
}
</script>
</head>
cs code
protected void Page_Load(object sender, EventArgs e)
{
TextBox2.Attributes.Add("onkeypress", "return abc();");
}
try this
I think you want to execute the javascript serverside and not in the browser after post-back, right?
That’s not possible as far as I know
If you just want to get it execute after postback, you can do something like this:
this.Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "xx", "<script>test("+x+","+y+");</script>");
If you are interested in processing Javascript on the server, there is a new open source library called Jint that allows you to execute server side Javascript. Basically it is a Javascript interpreter written in C#. I have been testing it and so far it looks quite promising.
Here’s the description from the site:
Differences with other script engines:
Jint is different as it doesn’t use
CodeDomProvider technique which is
using compilation under the hood and
thus leads to memory leaks as the
compiled assemblies can’t be unloaded.
Moreover, using this technique
prevents using dynamically types
variables the way JavaScript does,
allowing more flexibility in your
scripts. On the opposite, Jint embeds
it’s own parsing logic, and really
interprets the scripts. Jint uses the
famous ANTLR (http://www.antlr.org)
library for this purpose. As it uses
Javascript as its language you don’t
have to learn a new language, it has
proven to be very powerful for
scripting purposes, and you can use
several text editors for syntax
checking.
<head>
<script type="text/javascript">
function test(x, y)
{
var cc = "";
for (var i = 0; i < x.length; i++)
{
cc += x[i];
}
cc += "ny: " + y;
return cc;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:Button ID="Button1" runat="server" Text="Button" />
<p>
<asp:TextBox ID="TextBox1" Name="TextBox1" runat="server" AutoPostBack="True" TextMode="MultiLine"></asp:TextBox>
</p>
</form>
</body>
protected void Page_Load(object sender, EventArgs e)
{
int[] x = new int[] { 1, 2, 3, 4, 5 };
int[] y = new int[] { 1, 2, 3, 4, 5 };
string xStr = getArrayString(x); // converts {1,2,3,4,5} to [1,2,3,4,5]
string yStr = getArrayString(y);
string script = String.Format(" var y = test({0},{1}) ; ", xStr, yStr);
script += String.Format(" document.getElementById("TextBox1"").value = y "");