Tutorial 2 - Make An Asynchronous Calling

[steven]

What is AJAX?
AJAX = Asynchronous JavaScript and XML
In this tutorial, we will make an application for asynchronous calling.
The simplest way for  asynchronous calling in Sigma Visual is to use function linb.request. Its definition can be found at http://www.sigmawidgets.com/products/sigma_visual/API/index.html#linb.request.
It's declared like the following line.
request ( uri, query, onSuccess, onFail, threadid, options );
It's a little complex because it takes 6 parameters. Don't worry about that. For simple code, the first three parameters are enough.

• uri: The URL of the request target. For example, "http://www.google.com/".
• query: This is web request parameters pairs. For example, "{para1:1,para2:2}".That will get the same result as we input http://www.google.com/?para1=1&para2=2 in the browser.
• onSuccess: A function to be executed whenever a request is done successfully. I will explain this function later. But now let's make an application first.

[Req Spec]
1. A dialog window and a button are needed.
2. When end user clicks button, content of another html file will be retrieved and put into dialog window.

[Do It Yourself]
1. Drag a [Dialog] to design area，set its alias to "dialog1"(Click dialog window to select it, type "dialog1" in [Component Config Window]->[alias]，and strike [Enter] on keyboard. )
2. Drag a [Button] to design area.
3. Prepare a file named hello.html to http://localhost/hello.html. It reads
<h1>Hello, the world</h1> <p>this is my first AJAX application with Sigma Visual</p>
4. Add event handler for button being clicking. (Click button to select it，click on right side of [Component Config Window]->[events]->[onClick]，a small button will appear. Click this button, a dialog box will pop up.)
5. You will see the following lines in the dialog
function (profile, e, src, value) { }
6. In the handler, we will call linb.request. Let's have a look of code snippet.
linb.request(             "http://localhost/hello.html",             null,             function(rep){                                me.dialog1.setHtml(rep);                  });

The first parameter, "http://localhost/hello.html", is what we will get synchronously.
The second parameter, the url parameters pairs, is set to null because hello.html is a static html file, not a php file or something else.
The third parameter is function, which will change inner html of dialog1 by calling setHtml(). Variable rep is the result of asynchronous calling to hello.html.

7. Something interesting is that we store variable this to a variable, me. It is a must because variable this in Javascript is quite different from the one in c++/java. You could get more knowledge by search "this in javascript" in google.The whole code looks like
function (profile, e, src, value) {             me = this;             linb.request(             "http://localhost/hello.html",             null,             function(rep, type){                 me.dialog1.setHtml(rep);                }); }

8. Click [OK] to close dialog.
9. Press [run] to see the result.

[Lando]

Translation to portugues brazilian:

Translation 2

[will]

How would I go about using settimeout() to periodically fire off the ajax request every 30 seconds or so?  I've looked through the docs and can't seem to find anything relevant.


thanks,
Will

[linb]

Why don't you use setInterval?
Or use linb.Thread in jsLinb.

If you use 2.2 version in svn:
linb.Thread.repeat(function(){    //fire the ajax request }, 30000);

Or, in the previous version :
linb.Thread.(null, [function(){    //fire the ajax request }], 30000, null, null, null, true).start();

[will]

I'm using 2.1 still, but am a complete noob.  How would I plug that snippet into the tutorial example?  I've been playing with it for awhile but haven't figured it out.


thanks,
Will