How to pass value to javascript from code behind page?

Question 1

I have web application where i want to call one method on body onload method.

I have method like this

<body id="pageid1" onload="SetupFeaturedProperty(1,['http://www.brightlogic-estateagents.co.uk/MRUS/upload/918-1.jpg', 'http://www.brightlogic-estateagents.co.uk/MRUS/upload/918-2.jpg', 'http://www.brightlogic-estateagents.co.uk/MRUS/upload/918-3.jpg', 'http://www.brightlogic-estateagents.co.uk/MRUS/upload/918-4.jpg']);SetupFeaturedProperty(2,['http://www.brightlogic-estateagents.co.uk/MRUS/upload/665-1.jpg', 'http://www.brightlogic-estateagents.co.uk/MRUS/upload/665-2.jpg', 'http://www.brightlogic-estateagents.co.uk/MRUS/upload/665-3.jpg', 'http://www.brightlogic-estateagents.co.uk/MRUS/upload/665-4.jpg']);SetupFeaturedProperty(3,['http://www.brightlogic-estateagents.co.uk/MRUS/upload/38-1.jpg', 'http://www.brightlogic-estateagents.co.uk/MRUS/upload/38-2.jpg', 'http://www.brightlogic-estateagents.co.uk/MRUS/upload/38-3.jpg', 'http://www.brightlogic-estateagents.co.uk/MRUS/upload/38-4.jpg']);SetupFeaturedProperty(4,['http://www.brightlogic-estateagents.co.uk/MRUS/upload/122-1.jpg', 'http://www.brightlogic-estateagents.co.uk/MRUS/upload/122-2.jpg', 'http://www.brightlogic-estateagents.co.uk/MRUS/upload/122-3.jpg', 'http://www.brightlogic-estateagents.co.uk/MRUS/upload/122-4.jpg']);SetupFeaturedProperty(5,['http://www.brightlogic-estateagents.co.uk/MRUS/upload/1076-1.jpg', 'http://www.brightlogic-estateagents.co.uk/MRUS/upload/1076-2.jpg', 'http://www.brightlogic-estateagents.co.uk/MRUS/upload/1076-3.jpg', 'http://www.brightlogic-estateagents.co.uk/MRUS/upload/1076-4.jpg']);">

And the arguments of these method can be change in after some time.

I want to pass the argument when my page is loaded.

I have tried lot of method to pass the argument from code behind page to this page but it's not working. Please let me know a better solution for this.

Thanks

Question 2

What do you mean by "I want to pass the argument when my page is loaded." Do you want to pass the arguments after your page is loaded in the browser or you want the arguments to be there when the page is loaded in the browser?

Question 3

I want the arguments there when my page is loading in browser. But this values can be change. So i want to update these value from code behind before page load.

Question 4

So you want to render HTML with attributes taken from code behind?

Question 5

use this:

Page.ClientScript.RegisterStartupScript(this.GetType(), "myScript",getScript(),true);

and then:

private string getScript()
{
 return "SetupFeaturedProperty(etc,etc,etc);";
}

If you are using UpdatePanels use the ScriptManager class instead of Page.ClientScript

Question 6

There are multiple ways to do this. You can register the scripts using the RegisterClientScript method. You can make the body tag a server control and set it's onload attribute in the code behind or you can use Literal tag. However the method I find most clean is creating a JS variable and assigning it's value with a serverside code then using this variable in your JS code:

<script> var someVariable = <%= SomeProperty %>;</script>

Make sure that you define properties in your page and not move all your code behind in the markup.

Another good approach is to define a function for your event that takes the element as an input (pass this as the argument) and then attach the actual arguments as different attributes to the element.

<body runat="server" id="body" onload="onLoad(this)" data-someArg="someValue">...

You can set the attributes from your code behind like this

body.Attributes["data-someArg"] = "someValue";

This will be invalid in HTML4 but will work fine in all browsers and it will be valid in HTML5 as long as you prefix the attribute name with data-

Question 7

Use ClientScript.RegisterStartupScript. Check MSDN:

MSDN - Javascript and ASP.NET 2.0

MSDN - ClientScript.RegisterStartupScript

Question 8

One way to do it is to setup a Literal tag in your javascript. For example:

function somemethod()
{
 var number1 = 10;
 var number2 = <asp:Literal ID="litNumberFromCode" runat="server"/>;
 alert(number1 + number2);
}

Then in your code behind access that control like any other:

litNumberFromCode.Text = 15;

Question 9

I suggest droping the literal tag and using <%= %> syntax with a property in the code behind. Having ASP.NET Literal tag in the JS code looks somewhat ugly.

Question 10

Very true, plus this method doesn't play so well with intellisence and does have a drawback that makes it visually unappealing. But there is always 1000 ways to skin a cat as they say.

Question 11

Try using inline c# <% %> with your values printing

Luis Luis 6,0012 gold badges34 silver badges51 bronze badges · Accepted Answer · 2011-02-09 13:50:17Z

use this:

Page.ClientScript.RegisterStartupScript(this.GetType(), "myScript",getScript(),true);

and then:

private string getScript()
{
 return "SetupFeaturedProperty(etc,etc,etc);";
}

If you are using UpdatePanels use the ScriptManager class instead of Page.ClientScript

CollectivesTM on Stack Overflow

How to pass value to javascript from code behind page?

5 Answers 5

Comments

Comments

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Post as a guest

Hot Network Questions

CollectivesTM on Stack Overflow

5 Answers 5

Comments

Comments

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Post as a guest

Related