Re: Attempt to de-mystify AJAX

Hi Chandru,

> Ah, thank you for the explicit code! I learned something, that you can setup
> the entire Select element via the innerhtml change (which should be obvious

You are welcome. Note that the State and Country fields are also being
created and populated by the PHP script. The Country is just being
dummied in since it is a US Zip Code database.

This fits with my assertions that the source of the data (the HTML text
in this case) doesn't matter. The only thing that matters here is that
we close our 'ended' tags and so on. But that would be an issue in a
static page as well.

My approach to this has been to create tiny PHP scripts that do a
specific task then output the results to the browser. This makes for a
bunch of little scripts but seems to be very fast and efficient.

> after all this time, but...) We do that with a loop of " new Option= xxx" to
> populate each option of the Select element, and I wonder how much more
> efficient this one-shot method is?

Are you using js for the 'new Option=xxx' loop? If so I suspect that
the server side processing will be quicker (but don't know that).

It has surprised me how quickly my experiments respond using PHP and
openQM. The dictionary example I posted a while ago is a database
containing the entirety of the 1913 edition of Webster's and the
entries come up almost instantly. This current demo is a 4mb database
of current zip codes.

This is all on an old PII 350mhz machine with approx. 25 live virtual
domains being served by Apache and five or so by qmail/vpopmail.

I am anxious to try Coyote in this context.

Since you can't see it, here is the PHP code that builds the select
item (line numbers for notes below only):

001: $resp = "<select id='city'>\n";
002: $row = QM_Fetch_Array($result);
003: $st = $row['STATE'];
004: $cty = explode(VM, $row['CITY']);
005: $ap = explode(VM, $row['APN']);
006: if(! is_Array($cty))
007: $cty = array($cty);
008: if(! is_Array($ap))
009: $ap = array($ap);
010:
011: while(list($key, $city) = each($cty)) {
012: $apn = $ap[$key];
013:
014: if($apn == "P")
015: $aSel = " selected";
016: else
017: $aSel = "";
018:
019: $resp .= " <option value='$city'$aSel>$city</option>\n";
020: }
021: $resp .= "</select>\n";
022: $resp .= "St:
023: <input type='text' id='state' size='2' value='$st'>
024: Ctry:
025: <input type='text' id='ctry' size='6' value='US'>\n";

034: echo $resp;
... and end routine ...

The HTML code that is visible by viewing the source of the zipall.php
script is all built as a string, elements concatenated ('.' is PHP's
concatenation operator instead of PICK's ':')

After determining that the query yielded results (not shown), the
string is initialized in line 1 to the opening select tag.

Line 2. fetches a 'row' of query result (should be only one row in
this).

Line 3. assigns the variable with which to fill the state field.

Lines 4. and 5. Simply convert a PICK delimited item into PHP arrays.

Lines 6. through 9. convert a single value into an array if the
attribute only contains one value. This is needed for the list that
follows.

Lines 11. through 20. enumerate the values of the 'City' array. During
this enumeration:

Line 12. fetches the 'Accepted' 'Preferred' or 'Not Accepted' flag for
the current City value.

Lines 14. through 17. test if this is the Preferred city for this Zip.
If so, sets the 'selected' attribute of this option. If not, NULLs it.

Line 19. adds this city to the <option></option> list.

Line 21. closes the <select> tag.

Lines 22. through 25. add the State and Country text fields.

After closing all of the conditionals leading to this snippet,
Line 34 outputs the string to the browser and from there ...

.... we are back to the js processChange() routine, which stuffs that
string into the <span> we set up in the original HTML.

Hope this unsolicited bunch of code doesn't obscure things or is
otherwise unwelcome.

HTH,
-Tom

.

Relevant Pages