CODEWITHSUNDEEP
javascriptasp.netarraysparameter-passing
EPApro
EPApro

Reputation: 73

passing variable values from c# to javascript

First of all, sorry for bringing a question that has been answered so many times, but I have tried most of the procedures mentioned and still can't get it working.

I have an ASP.NET app (server-side), and I would like to visualize some results by using WebGL (JavaScript, client-side). I am able to create the canvas in aspx file and to draw a 3D object (a cube) by writing ALL the necessary JS code in a jscript file (As long as I know what I want to draw in advance, and writing all that in Jscript). However, my intention is to write a different object depending on my server-side code. When I click a visualize button, a postback is triggered. In the server some code is executed, and some coordinates are returned in an array, defined global in the aspx.cs file. I would need to pass that array of node coordinates from the server to the JS file in order to draw actually the object I want.

Here is basically what I have tried:

I have tried this not with an array, but just with a string variable and if writing: alert(clientVariable); I see "<%=ServerVariable%>" in the window, NOT the actual value. I don´t know if I need any additional library or what. If I can't even get this easy example working, I don't know how I would even do it with a double array. I´m using MCVS08, ASP.NET 3.5 with HTML5.

So basically, summing Up, I would like to have:

Any suggestion/comment would be very appreciated. As the dummy example with a simple string is not working (forgetting about canvas, webGL and all that stuff), may I need anything else or am I misunderstanding how to do it properly?

Upvotes: 2

Views: 9659

Answers (2)

Valera Kolupaev
Valera Kolupaev

Reputation: 2315

When I need to pass variables into JavaScript I usually I prefer var clientVariable = '<%=ServerVariable%>'; solution. This method is sufficient for small number of scalar variables. If you need to pass a complex object or a array, consider to use JavaScriptSerizlizer.

The behavior you are having it might happen for number of reasons. One of them might occur, if you have included a scriptlet into .js file, and not into .aspx file.

Here is how I would do this:

webgl-draw-file.js:

window.WebGlDraw = function(points /* point array */)
{
  // Draw points here
}

Page1.aspx.cs:

public string GetSerializedServerVariable()
{
    new System.Web.Script.Serialization.JavaScriptSerializer().Serialize(ServerVariable);    
}

Page1.aspx:

<html>
<header>
    <script src="webgl-draw-file.js"/>
    <script type=text/javascript>
        window.WebGlDraw(<%=this.GetSerializedServerVariable()%>);
    </script>
</header>
<body>
...
</body>
</html>

To understand a better what values are passed to the JS function, take a look at a page source using your browser. You should see a JSON representation of your array instead of <%=Page.GetSerializedServerVariable()%> scriptlet.

It should look something like this:

<html>
<header>
    <script src="webgl-draw-file.js"/>
    <script type=text/javascript>
        window.WebGlDraw([{x:1, y:2}, {x:1, y:2}, {x:1, y:2}, {x:1, y:2}]);
    </script>
</header>
<body>
...
</body>
</html>

Upvotes: 3

Momin
Momin

Reputation: 868

can u serialize the data like this:

<% var serializer = new System.Web.Script.Serialization.JavaScriptSerializer(); %>
var doublearr = <%= serializer.Serialize(ServerVariable) %>;

Upvotes: 0

Related Questions