Information

It's here

(Disclaimer: This is still to some extend preview technology and some things might change before final release)

There's a saying in Spanish "lo prometido es deuda", roughly translated "that what is promised, is a debt". We promised better and more direct Ajax support for Intraweb, and now it's here. Yes, sure it's the initial phase but the architecture has been layed out for full support, the rest is just icing on the cake.

How does it work? Well first of all, this is "pre-release" version of what will be in 8.0.23 and after. There are still some 'gotchas' and certain 'hicups' but as I said, we are working on fixing them. However, here is a sneak preview of what is in store.

Asynchronous Calls

Fist and foremost, Ajax is about Javascript: it implies Javascript, whether you like it or not. Javascript isn't all that bad. Wait a minute! I hear someone shouting out already "didn't you say we don't need to learn JS for IW????" Hold your horses...I'll explain later on.

8.0.23 introduces certain new properties and events. Buttons, Edits, ListBoxes, etc. all have (and those that do not yet, will do) new events which are of the type AsyncXXXX, where XXX is Click, DoubleClick, Change, etc, as shown in the figure below.

These calls make an asynchronous call to the server using AJAX techniques. When you double-click any event, you get the typical Delphi event where you can type in code. For example, let us take a OnAsyncClick event of a TIWButton:

procedure TformMain.IWButton1AsyncClick(Sender: TObject;
  Session: TIWApplication);
begin
 
end;

The Session parameter represents the WebApplication object (Session object) under which this call is made. Intraweb takes care of the following:

1. When an Ajax call is made, it verifies that the session is valid and there is no hijacking taking place.

2. It identifies the correct session and looks up the correct event handler to handle the server side event

3. It submits the required information for the event.

What does 3 mean? Well, if you have ever done any AJAX calls, you know that on the server side you somehow need to access the information submitted. This is normally done using Javascript with calls such as document.getElementByID(.....). Not here! Intraweb already processes this information and copies the values to the form's controls, so that you can directly access the value submitted using your normal Delphi properties, i.e. IWEdit1.Text has the submitted value.

But doesn't this create an overhead? No. Intraweb allows you to specify what you want to send over the wire using properties of the control. Apart from the events, each control has a series of properties that define what you want Intraweb to submit when you make the asynchronous call. There is one for each event. This way you can have different events submit different things. The following figure shows an example:

apControl indicates that ONLY the actual control value is submitted back. apForm indicates that all the form is submitted.

So, now we have the information on the server, what do we do next? Well, here is where Javascript comes into play. We need to update the information. What we are going to be adding is a whole set of Javascript routines to make development easier. Let's take an example: Adding a value typed into an IWEdit to a IWListBox. One way of doing it would be:

procedure TformMain.IWButton1AsyncClick(Sender: TObject;
  Session: TIWApplication);
begin
  if Session.Browser in [brNetscape7]then begin
    Session.SendAsyncResponse(Format('document.getElementById("IWLISTBOX1").
       appendChild(new Option("%s", "%s"))', [IWEdit1.Text, IWEdit1.Text]));
  end else begin
    Session.SendAsyncResponse(Format('document.getElementById("IWLISTBOX1").
       add(new Option("%s", "%s"))', [IWEdit1.Text, IWEdit1.Text]));
  end;
end;

An "Intraweb way" would be:

procedure TformMain.IWButton1AsyncClick(Sender: TObject;
  Session: TIWApplication);
begin
  Session.EmitCommand(AddListBoxEntry(IWListBox1, IWEdit1.Text, IWEdit1.Text));
  Session.SendAsyncResponse;
end;

where AddListBoxEntry is a predefined function offered by Intraweb that calls an equivalent Javascript call that automatically adds an entry to the listbox specified and emits the correct code based on the browser. This allows Intraweb to be extensible and not limited to what the libraries will offer, and only limited by the imagination of the developer.

The great thing is that this new async calls work in both umAll and umPartial and we are going to be adding a lot more functionality.

The ultimate idea is for us to not have to make Javascript calls to make updates. However, this is not done overnight and therefore require time and investment. We could have held off on all Ajax support until we came up with an approach for doing this, but we made the decision not to. By releasing support for Ajax in phases, we not only allow our users to make use of the technology now, but we also do not limit it to what Intraweb can offer today, but what can be done. So stay tuned...there is more to come!