backbutton on RB links

[votan]

Is it a normal behavior that using the browsers back button sometimes works on links generated by RBcode via the "link"-command and sometimes not? On some links of my code the backbutton works... on others it does not... so the page stays the same after hitting the back button then... even though all links are done the same way. Or does it depend on how the code is done after the link.... would like to know what the browser is actually doing, to be able to controll the back button function with RBlinks....

[carlgundel]

Sept 16, 2008 5:54:39 GMT -5 votan said:

Is it a normal behavior that using the browsers back button sometimes works on links generated by RBcode via the "link"-command and sometimes not? On some links of my code the backbutton works... on others it does not... so the page stays the same after hitting the back button then... even though all links are done the same way. Or does it depend on how the code is done after the link.... would like to know what the browser is actually doing, to be able to controll the back button function with RBlinks....

There is a big difference between a static web page where links always point at the same thing (usually a file) and a web application where the meaning of a link is transient. If you're building a "web application" consider yourself lucky if any of the links still work after hitting the back button. This is true if your application is written in Perl, Ruby, Run BASIC or just about anything.

My ultimate goal with RB is provide an easy way to use AJAX techniques so that the back button becomes irrelevant.

In the meantime, try to design your application so that you never have any reason to hit the back button. Pretend it is a desktop application and that the back button doesn't exist.

-Carl

[votan]

Thanx, got it!
Would be cool to integrate AJAX in an easy and usable way in to RB, so that most things can be done without page refresh, without us users being JS-cracks....

[kokenge]

I wrote a ajax system that is simple to use and executes RB or anything on the server side without a refresh.

However, unless someone can show me how, there is no way to do triggers such as onChange or onCLick or other events with the textbox or textarea.
So I use the html <input tag with the trigger event.

You tell JS the program to execute on the server side and send it many fields as you want by separating the "field - value" pairs with a bar (|).
Same with sending stuff back to the client. Simply use the Print command and separate the "display field - value" pairs with (|). It displays the values to as many fields on your screen as you want.

Get docs and downloads here www.dkokenge.com/ajax/

[votan]

tried your demo in IE7.. but none of the functions seem to work... IE only brings up an errormessage that the script will slow down the browser if continued....

[carlgundel]

Sept 16, 2008 12:00:39 GMT -5 votan said:

tried your demo in IE7.. but none of the functions seem to work... IE only brings up an errormessage that the script will slow down the browser if continued....

I got the same error using IE6.

-Carl

[kokenge]

You are correct. I had it written for RB-1 and not converted to RB-2 yet. Sorry about that.

Anyway I wrote a quick program and tested it on FireFox. I do not have IE on my machine so can't test that.

It's a very simple test. It has customer id and product id. when you change either value it sends a message to the backend and it sends back what it received and the function it's supposed to do.

Notice to pass the value of a variable you need to enclose it in "|" such as the custid and prodid. I used the separator of "&" and that seems to be safe.

The backend sends back where you want the data followed with a "|" and the data you want returned there followed with a "|"

No known limit I can think of on the number of things you send back and forth.

I wanted a very small JS footprint that could do a lot of stuff. Couldn't find anything for RunBasic so had to write my own.

If you have problems with this let me know.

I have 2 projects
a_project - the client side program
abe_project - the back end server program

Not sure why, but before it will work, you must publish the backend project abe:

Here is the client side a:

TITLEBAR "Ajax Test"

' ---------------------------------------
' Backend communications
' ---------------------------------------
html "<script language='javascript'>
<!--

function createRequestObject()
 {
 var ro;
 var browser = navigator.appName;
 if(browser == 'Microsoft Internet Explorer')
   {
   ro = new ActiveXObject('Microsoft.XMLHTTP');
   }
 else
   {
   ro = new XMLHttpRequest();
   }
 return ro;
 }

var http = createRequestObject();

function trim(string)
 {
 while (string.substring(0,1) == ' ')
   {
   string = string.substring(1, string.length);
   }
 while (string.substring(string.length-1, string.length) == ' ')
   {
   string = string.substring(0,string.length-1);
   }
 return string;
 }

function handleResponse()
 {
 if(http.readyState == 4)
   {
   var response = http.responseText;
   
//alert ('got back from server response:' + response);
   var at = 0;
   
   // --- strip leading junk ----
   x   = response.substring(0,1);
   while (x < '0')
     {  
     response = response.substring(1);
     x   = response.substring(0,1);
     }
   var update = new Array();
   if(response.indexOf('|' != -1))
     {
     update = response.split('|');
     x = update.length;
     //  alert ('update length:' + x);
     for (i=0;i<x;i++)
       {
       update[i] = update[i].replace(/;;/g ,'|');
       }
     for (i=1;i<x;i=i+2)
       {
       at = i - 1;
       update[at] = trim(update[at]);
       //  alert ('at:' + at + '|update[at]:' + update[at] + '|i:' + i + '|update[i]:' + update[i]);
       
       try
         {
         ss = document.getElementById(update[at]);
         ssv = ss.value;
         sse = ss.element;
         sst = ss.title;
         ssn = ss.name;
         ssi = ss.id;
         ssh = ss.innerHTML;
         //  alert ('ss:' + ss + '|ssv:' + ssv  + '|sse:' + sse  + '|ssn:' + ssn  + '|ssi:' + ssi  + '|ssh:' + ssh + '|at:' + update[at] + '|i:' + update[i] );
         
         if (ssv != undefined)  ss.value = update[i];
         else
         if (ssh != undefined)  ss.innerHTML = update[i];
         }
       catch(err)
         {
         alert ('Invalid display field:' + update[at]);
         }
       }
     }
   }
 }

function trim(stringToTrim)
 {
 return stringToTrim.replace(/^\s+|\s+$/g,"""");
 }
function ltrim(stringToTrim)
 {
 return stringToTrim.replace(/^\s+/,"""");
 }
function rtrim(stringToTrim)
 {
 return stringToTrim.replace(/\s+$/,"""");
 }
function server(prog)
 {
 prog = ltrim(prog);      // Left trim
 rs = http.readyState;    // see if the previous task it done - state must be 0
 if (rs == 4) rs = 0;
 if (rs != 0)
   {
   rs = 0;                // ?????? why don't this work ??????/
   try
     {
     rs = http.readyState;    // see if the previous task is done - state must be 0
     }
   catch(err)
     {
     rs = 1;  
     alert ('Server Busy. Please try again. Thank you and have a nice day ' + rs);
     }
   }
 
 if (rs == 0)  
   {
   prog1 = '';
   xx  = '';
   if(prog.indexOf('|' != -1))
     {
     val = prog.split('|');
     for ( key in val)
       {
       //  alert('key:' + key + ' |val:' + val[key]);
       x = '';
       xx = val[key];
       if (key & 1)
         {
         try
           {
           x   = document.getElementById(xx).value;
           toe = document.getElementById(xx).type;   // type of element
           chk = document.getElementById(xx).checked;
           prog1 = prog1 + x;
           }
         catch(err)
           {
           //  alert ('--error----xx:' + xx + '|err:' + err.description);
           prog1 = prog1 + err.description;      
           }
         //  alert ('------x:' + x + '| toe:' + toe + '| chk:' + chk);
         }
       else prog1 = prog1 + xx;
       }
     }
   
  // alert ('server side get program| prog1:' + prog1);
   
   http.open('get', prog1);
   http.onreadystatechange = handleResponse;
   http.send(null);
   }
 }
//--></script>
"

html "<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0>
<TR><TD BGCOLOR=#FF9966 id=errMsg></TD></TR>
<TR><TD BGCOLOR=#FFFF66 id=wrnMsg></TD></TR>
<TR><TD BGCOLOR=#99FFCC id=infoMsg></TD></TR>
</TABLE>"

html "<TABLE BORDER=1 CELLPADDING=0 CELLSPACING=0>"
html "<TR><TD BGCOLOR=#CCCCE5 ALIGN=RIGHT>Customer Id</TD><TD>"

html "<INPUT TYPE='TEXT' id='custid' SIZE=20 onChange=""server('/seaside/go/runbasicpersonal?app=abe&funct=custid&|custid|');"">"

html "</TD></TR><TR><TD BGCOLOR=#CCCCE5 ALIGN=RIGHT>Customer Name</TD>"
html "<TD id=cname></TD></TR>"
html "<TR><TD BGCOLOR=#CCCCE5 ALIGN=RIGHT>Address</TD>"
html "<TD id=caddr></TD></TR>"
html "<TR><TD BGCOLOR=#CCCCE5 ALIGN=RIGHT>Product Id</TD><TD>"

html "<INPUT TYPE='TEXT' id='prodid' SIZE=20 onChange=""server('/seaside/go/runbasicpersonal?app=abe&funct=prodid&|prodid|&|custid|');"">"

html "</TD></TR><TR><TD BGCOLOR=#CCCCE5 ALIGN=RIGHT>Product Descr</TD>"
html "<TD id=pdescr></TD></TR>"
html "</TABLE>"

wait  


Here is the server backend abe:

a$ = UrlKeys$
funct$ = word$(UrlKeys$,2,"&")
funct$ = word$(funct$,2,"=")

sendBack$ = "infoMsg|Data Received ";UrlKeys$;"|wrnMsg|Function:";funct$;"|"

' ----------------------------------
' Customer ID processing
' ----------------------------------
if funct$ = "custid" then
custid$ = word$(a$,3,"&")
if custid$ = "" then
   sendBack$ = sendBack$ + "errMsg|Customer id s blank"
   goto [sendIt]
end if
sendBack$ = sendBack$ + "cname|Customer name for id:";custid$;"|"
sendBack$ = sendBack$ + "caddr|Customer addr for id:";custid$;"|"
end if

' ----------------------------------
' product ID processing
' ----------------------------------
if funct$ = "prodid" then
prodid$ = word$(a$,3,"&")
custid$ = word$(a$,4,"&")
if custid$ = "" then
   sendBack$ = sendBack$ + "errMsg |No Customer ID for product id:";prodid$;"|"
   goto [sendIt]
end if
sendBack$ = sendBack$ + "pdescr|Product id:";prodid$;" for Customer id:";custid$;"|"
end if

[sendIt]
raw sendBack$
wait
end


[carlgundel]

Sept 16, 2008 15:20:24 GMT -5 kokenge said:

Not sure why, but before it will work, you must publish the backend project abe:

Could it be because of lines like this?
html "<INPUT TYPE='TEXT' id='custid' SIZE=20 onChange=""server('/seaside/go/runbasicpersonal?app=abe&funct=custid&|custid|');"">"
-Carl

[kokenge]

It's the back end project "abe_project" that has to be published.
So doubt it has anything to do with the input tag in the front end "a_project"

But dunno - I was surprised and happy I got it to work so I never looked back..

Dan

[carlgundel]

Sept 16, 2008 15:41:41 GMT -5 kokenge said:

It's the back end project "abe_project" that has to be published.
So doubt it has anything to do with the input tag in the front end "a_project"

But dunno - I was surprised and happy I got it to work so I never looked back..

It has to do with this part:
app=abe
The URL in question specifies the abe application, so it must be published.

-Carl