Ajax and executables

[Mr. Kevin Diggins]

I fear I already know the answer but here goes.

AJAX is very useful for saving and loading content into a web page without the penalty of a page refresh.

Is it possible using AJAX to run a CGI-like server application (win32 executable) without incurring the penalty of a page refresh like you'd get from a normal CGI app?

[Martin Draper]

Kevin,
The answer is yes and no. AJAX is basically using javascript to get data from another application. So in that sense Yes. This is an example from a powerbasic web app payment.exe that calls a powerbasic web app accdir.exe to get a selection from a list of accounts without doing a page refresh. It does not use an ajax framework as such but is the same concept.

'
'
' Debit Account
'
   WriteCGI "<td align ='right'><b>Debit </b></td>"
   WriteCGI "<td><input type='TEXT' name='Debit' value=" + CHR$(34) +Debit + CHR$(34) +" size=8 maxlength=8 "
   WriteCGI " onclick=" + CHR$(34)+ _
            "window.open('AccDir.exe?Task=Lookup&Form=Payment.Debit&TaskID=User&AccType=PaymentDebit','StatusWin', 'scrollbars=yes,width = 450,screenX=(screen.width-450)/2, " + _
                    "screenY=(screen.height-600)/2');" +CHR$(34)+ " onchange=" +CHR$(34)+"upperCase(this.id); "+CHR$(34)+"></td>"
   WriteCGI "<td>&nbsp;</td><td>&nbsp;</td></tr>"

This the script used by the web app to return data to the web page.

FUNCTION PickScript AS INTEGER
'
' create the script to return the result to the call window
'
    writecgi"<SCRIPT LANGUAGE='JavaScript'>"
    writecgi "<!--"

    writecgi "function pick(symbol) {"
    writecgi "if (window.opener && !window.opener.closed) "
    writecgi "window.opener.document." + Form+ ".value = symbol;"
    writecgi "window.close();"
    writecgi "}"

    writecgi "// -->"
    writecgi "</SCRIPT>"
END FUNCTION

[Mr. Kevin Diggins]

It does not use an ajax framework as such but is the same concept.

Wow - Thank you for the valuable lesson Martin!

I had no idea it was so easy.

I now have a proof of concept running on IIS.

The only minor annoyance is the momentary flicker caused by the opening and closing of the window when the server app runs.

[Don Dickinson]

three basic ways to do ajax (a call to the web server without displaying a page).

1. use a hidden iframe to retrieve the data (ok if you don't mind iframes)
2. use a popup window to retrieve the data (this gives a flashing effect)
3. true ajax (where the name comes from) is using the XMLHttpRequest (non ie) and Microsoft.XMLHTTP object with IE

the web server has no idea that its slaving ajax vs a web page vs an image or whatever. it knows that your browse wants something and hands off the request to the proper handler (in your case a pb app). what is done with that data is up to the browser. so if you want to get data without refreshing the page, you use one of the methods above.

i've been using the dojo framework lately. it really wraps the javascript ajax calls up nicely.

here is a code snippet of the what the traditional javascript ajax call might look like:

  if (window.XMLHttpRequest) { // Non-IE browsers
    req = new XMLHttpRequest();
    req.onreadystatechange = internal_targetDiv;
    try {
      req.open("GET", url, true);
    } catch (e) {
      alert(e);
    }
    req.send(null);
  } else if (window.ActiveXObject) { // IE
    req = new ActiveXObject("Microsoft.XMLHTTP");
    if (req) {
      req.onreadystatechange = internal_targetDiv;
      req.open("GET", url, true);
      req.send();
    }
  }
    return false;
  }

and here is what a dojo call might look like:

      function panRightAjaxAdd (entityID) {
         setWaitPanel();
         dojo.xhrGet( {
               url : "wrmicro.dll?x_action=add&x_entity=" + entityID + "&x_session_id=##SESSION##",
               load : function(response, ioArgs) {
                  dojo.byId("pan_Right").innerHTML = response;
                  if (entityID == "list") {
                     dojo.byId('txt_ListName').focus();
                  } else if (entityID == 'site') {
                     dojo.byId('txt_SiteName').focus();
                  } else if (entityID == 'mailing') {
                     dojo.byId('txt_MailName').focus();
                  }

                  return response;
               },
               preventCache: true,

               error : function(response, ioArgs) {
                  dojo.byId("pan_Right").innerHTML = response;
                  return response;
               }
         });
      }

the cool thing about dojo is how it wraps up your http POST calls. it automatically collects the post variables for you and transmits them to the web server just by specifying the form name (see form: in the declaration).

         dojo.xhrPost( {
               url : "wrmicro.dll?x_action=" + saveAction + "&x_entity=" + entityID + "&x_session_id=##SESSION##&x_uid=" + saveUID,
               load : function(response, ioArgs) {
                  panRightAjaxList(entityID);
                  return response;
               },

               error : function(response, ioArgs) {
                  dojo.byId("pan_Right").innerHTML = response;
                  return response;
               },
               handleAs: "text",
               preventCache: true,
               form: dojo.byId("form_" + entityID)


         });

anyway, not trying to sell any specific framework (jquery has ajax calls too), but they do a mountain of work for you with pretty well tested code. however, the learning curve for these javascript frameworks can be large. dojo in particular is a massive libary.

best regards,
don

[Mr. Kevin Diggins]

three basic ways to do ajax (a call to the web server without displaying a page).best regards,don

Thanks for the info Don ... I am well immersed in the subject now and have
several ajax widgets incorporated.

For anyone into web development, you owe it to yourself to checkout the goldmine at http://www.dynamicdrive.com