tags:

views:

49

answers:

2
+1  Q: 

javascript + asp.net - Calling javascript functions from c# and passing an object

I'm fairly new to web development.

Basically I'm using a HTML5 canvas to render content, and javascript functions which clear and render to the canvas.

I'm hoping to call a web service to get data that would affect content, which I believe is most easily done from C#, and was wondering how I could use this to periodically call a javascript function that would update values that are being rendered to the canvas?

To make this clearer, I have something like this:

Oh I'm also using jquery by the way, partly because I was told to.

Page.asp:

<body>
    <form id="form1" runat="server">
        <canvas id="canv" width="200" height="200">
            Cannot display canvas because your web browser is a fail.
        </canvas>
        <script type="text/javascript">

        var ctrls = new Array();

        $(document).ready(function () {
            var canvas;
            var context;
            canvas = $("#canv").get(0);
            if (!canvas) {
                alert("Failed to get canvas");
                return;
            }

            context = canvas.getContext('2d');
            if (!context) {
                alert("Failed to get context");
            }

            var x;

            x = new Object();
            x.value = 0;
            x.parent2d = context;
            ctrls.push(x);

            window.setInterval(Render, 25);
        });

        function Render() {
            var i;
            for (i = 0; i < ctrls.length; i++) {
                ctrls[i].parent2d.clearRect(0, 0, 200, 200);
                //Draw stuff.
            }
        }

        function Update(newVal) {
            var i;
            for (i = 0; i < ctrls.length; i++) {
                ctrls[i].value = newVal; //For example
            }
        }

        </script>
    </form>
</body>

What is the easiest (if it's even possible) way to call the Update(newVal) function from C# (Page.asp.cs), and how could this be set up to be done periodically? What would be the limitations on what object(s) could be passed to this function?

Dictionary<String, Double>

would be very useful.

+1  A: 

When exactly does update need to be called after page load? If it's every five seconds, it might be easier to carefully set up some sort of Javascript-based interval (making sure you are checking certain conditions to ensure that the interval quits upon any error conditions).

Depending on what data you have, you may want to setup a method in C# that given certain POST or GET parameters passed to it via a jQuery $.ajax() call.

For instance:

$(document).ready(function() {
var intervalId = setInterval("runUpdate()", 5000);
});

function runUpdate() {
//Make an ajax call here, setting up a variable called 'data'

update(data);//Data is newVal, which was setup in the ajax call above
}

That code would run the update function every five seconds.

Mattygabe  2010-10-21 13:23:24
Hi, update would be called with/after periodic calls to a web service (say, every 10sec). I'd prefer to make the web service calls from C#, otherwise do you know of a good ajax tutorial?
Toby Wilson  2010-10-21 13:26:17
Alternatively, how to call c# method from javascript would be a good solution.
Toby Wilson  2010-10-21 13:28:57
Jquery's $.ajax() method is fairly simple: http://api.jquery.com/jQuery.ajax/ Once you design a method in C# to handle whatever parameters your jQuery sends it in Ajax, and then pass back a text-based value. $.ajax( type: 'POST', data: info_variable_sent_to_c_sharp, url: '/Your/Site/method', success: function() { //Do something here, it worked }, error: function() { //Do something else, it failed });
Mattygabe  2010-10-21 13:39:20
Essentially, the high-level view of the action sequence is this: 1. Page Loads 2. Javascript creates 10-second timer 3. Every ten seconds, call "runUpdate" javascript function 4. runUpdate performs an ajax request, getting a "new value" from your application 5. runUpdate calls update() using aforementioned "new value" 6. Steps 3-5 are repeated until the end of time
Mattygabe  2010-10-21 13:48:45
How do I get the returned value?
Toby Wilson  2010-10-21 15:19:08
From within the jQuery $.ajax call, you must define a variable in the callback function for the "success" condition. What format you use for your data will depend on what type of data it is. If the returned value is a number that doesnt have any security considerations, you can just have the C# return it as plain text. You'd access that value this way: success: function(return_value) { //Code here to use return_value variable }
Mattygabe  2010-10-22 03:55:08
From reading your post, it seems your returned value will be a Dictionary<String, double>, which would be better suited for Json: http://secretgeek.net/json_3mins.aspC# has a built-in function that you can call to format whatever information you have into JSON. It'd be called like this at the end of your function: return Json(your_dictionary);
Mattygabe  2010-10-22 03:59:15
+1  A: 

Hi, Firstly from Javascript I would normally avoid using xml based web services. The returned data is XML which has lots of unessesary tags which can cause transfer to be slow.

Instead look at JSON. Its much faster. However not so easy for authentication. To help you understand its power both twitter and facebook use it in there APIs.

JQuery can consume JSON really easy

$.getJSON(someurl, function(jData) {
//use returned data
}

You might find it useful to read this:

http://encosia.com/2008/03/27/using-jquery-to-consume-aspnet-json-web-services/

Hope this helps.

Chris  2010-10-21 13:34:27
The web service isn't my department so I'm stuck with an XML one unfortunately!
Toby Wilson  2010-10-21 13:36:06

related questions

Displaying Flash content in a C# WinForms application
How to get the value of built, encoded ViewState?
Unhandled Exception Handler in .NET 1.1
How do I connect to a database and loop over a recordset in C#?
How do I most elegantly express left join with aggregate SQL as LINQ query
Get a new object instance from a Type in C#
.NET Testing Framework Advice
Automatically update version number
What is the difference between an int and an Integer in Java/C#?
How to write to Web.Config in Medium Trust ?
WinForms ComboBox data binding gotcha
How do you sort a C# dictionary by value?
Adding Scripting functionality to .NET applications
Floating Point Number parsing: Is there a Catch All algorithm?
How do I print an HTML document from a web service?
Decoding T-SQL CAST in C#/VB.net
Anatomy of a "Memory Leak"
How do I get a distinct, ordered list of names from a DataTable using Linq
Reliable Timer in a Console Application
How do I fill a DataSet or a DataTable from a LINQ query resultset ?
What's the difference between Math.Floor() and Math.Truncate() in .NET?
How do I calculate relative time?
How do I calculate someone's age in C#?
Are there any conversion tools for porting Visual J# code to C#?
When setting a form's opacity should I use a decimal or double?