|
|
Posted by Jerry Stuckle on 01/23/06 04:59
one man army wrote:
> In article <AuSdnS-Ieqrk-E7enZ2dnUVZ_vydnZ2d@comcast.com>,
> Randy Webb <HikksNotAtHome@aol.com> wrote STUFF
>
>
> The following describes three situations:
> a) a javascript demo and its structure
> b) the attempt at using JS/PHP, and what went wrong
> c) the proposed finished product
>
> ========================================================================
> A - A Demo Site in Javascript/CSS/HTML
>
> There are two pages, lets call them Intro and Main. There is a single
> Javascript core, which is shared by both pages by means of a script
> include in the <HEAD>. The same JS functions are called in both Intro
> page and Main page.
> <script type="text/javascript" src="lHd.js" DEFER> </script>
>
> The Intro page consists of a table with a form in its center. It is
> named index.html. Along with sharp graphics and a logo, there is a
> single INPUT, type=TEXT.
> <input size="10" id="zipRaw_id" name="zipRaw_name">
> (TEXT by default,apparently. I added TYPE later)
>
> The form looks like this:
>
> <form name="ZipEnterText" method="get"
> onsubmit="return mainZipCheck()"
> action="aBasicSearchResult.html" >
> --
> Javascript function mainZipCheck() {
> var zipFld = null;
>
> // use a cover func with compatability code
> zipFld = getElementById_s( "zipRaw_id");
> if ( zipFld == null ) return;
> // do a simple RegEx check for digits
> if ( false == checkZipValid( zipFld.value))
> return false;
>
> if ( false == lkupZip( zipFld.value)) {
> window.alert( "Is that a valid California Zip Code?");
> return false;
> }
>
> return true;
> }
> --
> // (this is one of two places the SQL will come in later)
> Javascript function lkupZip() {
> uses a global called gzZip_DataSrc
> a javascript data object loaded by rote with 3000 zip codes inline
> search the gzZip_DataSrc
> return found
> }
>
> function zipDataObj( inZip) { this.zdZip = inZip;}
> function makeZipArray() {
> var i = 0;
> this[i++] = new zipDataObj( 90001 );
> ...
> }
> --
> Intro page is complete. When mainZipCheck() return true, the browser
> gets the url xxx/aBasicSearchResult.html?zipRaw_name="90000"
>
> ==========
> Main Page
> Upon entering the page, onLoad() checks for a URL with a tail. If
> present, the tail is read for zipRaw_name. Call the same lkupZip() for
> sanity check. This time, another global data object is initialized,
> gaAddr_DataSrc the Addr object. Same rote javascript inline data
> technique - the second place where SQL will be needed. The function take
> the ZipStr, an Array that will be filled out with indexes into the
> gaAddr_DataSrc, and returns the count of items found.
> function doAddrSearch( inZipStr, ioResArray)
>
> If addresses are found, a function is called to show the results on the
> Main page.
>
> On the Main page, there is a form in the sidebar with an identically
> named input and a submit button. Additional criteria are there also,
> which were defaulted from the intro page.
> <form name="EnterData" method="get" onsubmit=" return mainZipCheck()">
> <input size="10" id="zipRaw_id" name="zipRaw_name" maxlength="10" >
>
> So when the submit button is pressed, the browser gets a new URL
> xxx/aBasicSearchResult.html?zipRaw_name="90000" The Action apparently
> defaults to the current page.
>
> Main Page is complete.
>
> ========================================================================
> B- What I tried and How it Went Wrong
>
> I found by reading USENET and some web sites that there was a hack
> that allowed a dynamic appending of a script element, which then
> executes. By specifying that script element as Javascript, but calling
> the file xxx.php, an arbitrary amount of JS/PHP can be executed, eg
> Dynamically Loaded Scripts.
>
> I created a MySQL database with a table of Zip Codes, and the PHP
> snippet which calls the database and executes a simple query. I used
> phpMyAdmin to load the database and create the query string.
>
> In the Intro page I experimented with onSubmit() and the Action in the
> form. I was having problems, so I added a button which simply called a
> javascript function for testing purposes.
>
> I intended to call PHP to do the query, then read the result back in
> Javascript. Since I could not find a way of passing a PHP var into
> something Javascript can read, I set the content of a hidden field to
> the number of items found, or the error msg on SQL error.
>
> This all worked. But in the next line of Javascript, upon returning
> from the execution of the PHP via document.body.appendChild(
> scriptElement), the result of the query was not there yet. Apparently
> there is some kind of event loop or somesuch that queued the execution
> of the PHP. The result was there visibly in the browser window, and on
> inspection with the Firefox DOM inspector.
>
> I do not know how to queue an event to chain calls in this
> environment. So the Intro page failed, and I did not get to the Main
> page.
>
> The Javascript looks like this:
>
> // jsHack Setup - Get base url
> var url = document.location.href;
> var xend = url.lastIndexOf("/") + 1;
> var base_url = url.substring(0, xend);
>
> var jsHack_get_error = false;
>
> function introZipCheck()
> {
> var tUrlStr = 'zipLkUp.php';
> // add ZipStr to URL for the PHP code
> tUrlStr = tUrlStr + '?' + 'z=' + getElementById_s('zipRaw_id').value;
>
> jsHack_do( tUrlStr );
>
> // check return result in a hidden field
> var elem = getElementById_s('divZipCheckRes');
> if ( null == elem ) {
> window.alert( "introZipCheck() - Problem finding result?");
> return false;
> }
> var tNode = elem.firstChild;
>
> if ( "1" != tNode.data) {
> window.alert( tNode.data + " Is that a valid California Zip
> Code?");
> return false;
> }
>
> return true;
> }
>
> //----------------------------------------
> function jsHack_do (url) {
> // Does URL begin with http?
> if (url.substring(0, 4) != 'http') {
> url = base_url + url;
> }
>
> // Create new JS element
> var jsel = document.createElement('SCRIPT');
> jsel.type = 'text/javascript';
> jsel.src = url
>
> // Append JS element (therefore executing the the PHP call)
> document.body.appendChild (jsel);
>
> return true;
> }
>
> -------------
> The PHP file that is called looks like this
>
> <?php
> include_once("./connect.inc.php");
> // defines $database, $map_testC
>
> $zip = $_GET['z'];
> $sql = 'SELECT `cazZip` FROM `zips_CA` WHERE cazZip = ' . $zip;
>
> $selected = mysql_select_db($database, $map_testC) ;
> if ( !$selected ) {
> $res = 'Not connected : ' . mysql_error();
> } else {
> $Result1 = mysql_query($sql, $map_testC) ;
> if ( !$Result1 ) {
> $res = 'No query : ' . mysql_error();
> } else {
> $res = mysql_num_rows($Result1);
> }
> }
>
> ?>
> // a javascript function which sets text content of a DOM element
> // use an inline PHP snippet to read the result string
> setTextContent( getElementById_s('divZipCheckRes'),
> "<?php echo $res; ?>" );
>
>
> ========================================================================
> C- The Desired Result
>
> I am attempting to dynamically update a page, based on local databases
> in Main. I tried an experiment with XMLHttpRequest() earlier, but found
> I was not able to call outside of my own domain without purchasing an
> digital signature certificate from Verisign or someone. That led me down
> the path of jsHack(), Dynamically Loaded Scripts. Due to the nature of
> my problem, I believe I can preprocess any data I will need and rely on
> local databases. I have put a large amount of effort into the jsHack()
> approach. Since I have all the parts working and am just missing reading
> the result from PHP back into Javascript, it seems like the right idiom
> might finish the puzzle.
>
> Also, I want to minimize the URL passing. Eventually there will be
> data that the solution requires is not publicly visible and putting that
> into the URL seems sloppy. Primarily though I am looking for the dynamic
> page updates that are the mark of current browser software.
>
> This is my first Javascript program so I am more than willing to
> change the design approach as appropriate. I appreciate thoughful
> comments or suggestions, and do appreciate the answers I have read on
> USENET that let me get as far as I have.
OK, your problem is you can't do what you want.
PHP is server side; javascript is client side. All PHP code is
processed before the page is sent to the browser; all Javascript code is
processed after the page gets to the browser.
PHP can generate Javascript code (just like it does HTML), but it can't
call Javascript.
And the only way you can "call" a PHP script from javascript is to load
a page (current or new) containing php code.
Also, PHP would not have queued the request. You must have another problem.
If you want to update one field with JS based on the contents of another
field, you'll have to pass all the information required, probably in a
hidden field. The other alternative is to submit the page back to
itself and reprocess the data to generate the output you desire.
--
==================
Remove the "x" from my email address
Jerry Stuckle
JDS Computer Training Corp.
jstucklex@attglobal.net
==================
Navigation:
[Reply to this message]
|