javascript + asp.net – Calling javascript functions from c# and passing an object – Education Career Blog

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++) {
                ctrlsi.parent2d.clearRect(0, 0, 200, 200);
                //Draw stuff.
            }
        }

        function Update(newVal) {
            var i;
            for (i = 0; i < ctrls.length; i++) {
                ctrlsi.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.

,

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.

,

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.

Leave a Comment