How to call a PHP script using JAvaScript

Discussion in 'Javascript' started by C.Joseph Drayton, Mar 18, 2006.

  1. I have a problem that I am hoping someone can help me with.

    First let me describe the problem. I have an HTML form that in one
    field has an onBlur call to a JavaScript function. When you exit the
    field, it calls the JavaScript routine, which in turn calls a PHP
    script. The PHP script runs returns the value needed. And returns to
    the JavaScript. The JavaScript function is then supposed to set
    alerts depending on the values returned from the PHP script. It
    doesn't. If you then move the cursor into the field and exit again,
    it again runs the JavaScript which calls the PHP script then
    proceeds to show the alerts exactly like it is supposed to.

    I did some experimenting, and if you use a button to run the
    JavaScript, the exact same thing happens. Click the button and the
    PHP script sends back the value, but no alert. You click the button
    a second time, and the alert shows.

    I am using the JavaScript monitor in FireFox v1.5 so I can see that
    the PHP script is being called and returning the correct value the
    first time. So what I am trying to figure out is why the routine has
    to be called twice before I get my alert.

    Below is the HTML, JavaScript & PHP that I am using.

    Thanks,
    C.Joseph


    >>>>>>>>>>> Start HTML/JavaScript Page <<<<<<<<<<<<<


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <title>Test New Member Creation</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <style type="text/css">
    <!--
    ..style1 {
    font-size: 36px;
    font-weight: bold;
    }
    body {
    background-color: #FEFED6;
    }
    ..style2 {font-size: x-large}
    -->
    </style>
    </head>

    <body>

    <p align="center" class="style1">Start Membership</p>

    <script language="javascript" type="text/javascript">

    var http_request = false ;
    var ctyfnd

    function chkcity()
    {
    tmp1 = document.crnew.stt.value ;
    tmp2 = document.crnew.cty.value ;
    prm="?stt="+tmp1+"&cty="+tmp2;
    makeRequest('chk2data.php',prm) ;
    thrspns = result.indexOf("fou~~und");
    if (thrspns<0) {
    ctyfnd="no" ;
    } else {
    ctyfnd="yes";
    }
    reqcity() ;
    }

    function reqcity()
    {
    if (ctyfnd == "no")
    {
    alert("We can not find a City named "+tmp2) ;
    document.crnew.cty.focus() ; }
    }


    function makeRequest(url, parameters)
    {
    if (window.XMLHttpRequest) { // Mozilla, Safari,...
    http_request = new XMLHttpRequest();
    if (http_request.overrideMimeType)
    {
    http_request.overrideMimeType('text/xml');
    }
    }
    else if (window.ActiveXObject) { // IE
    try {
    http_request = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
    try {
    http_request = new ActiveXObject("Microsoft.XMLHTTP");
    } catch (e) {}
    }
    }
    if (!http_request) {
    alert('Cannot create XMLHTTP instance');
    return false;
    }
    http_request.onreadystatechange = alertContents;
    http_request.open('GET', url + parameters, true);
    http_request.send(null);
    }


    function alertContents() {
    if (http_request.readyState == 4) {
    if (http_request.status == 200) {
    //alert(http_request.responseText);
    result = http_request.responseText;
    } else {
    alert('There was a problem with the request.');
    }
    }
    }
    </script>

    <form method="" name="crnew" action="">
    <table width="400" border="1" align="center">
    <tr>
    <td>State</td>
    <td> <select name="stt" size="1">
    <option value="0">- - Please Select - -</option>
    <option value="1">Alabama</option>
    <option value="2">Alaska</option>
    <option value="3">Arizona</option>
    <option value="4">Arkansas</option>
    <option value="5">California</option>
    <option value="6">Colorado</option>
    <option value="7">Connecticut</option>
    <option value="8">Delaware</option>
    <option value="9">Florida</option>
    <option value="10">Georgia</option>
    <option value="11">Hawaii</option>
    <option value="12">Idaho</option>
    <option value="13">Illinois</option>
    <option value="14">Indiana</option>
    <option value="15">Iowa</option>
    <option value="16">Kansas</option>
    <option value="17">Kentucky</option>
    <option value="18">Louisiana</option>
    <option value="19">Maine</option>
    <option value="20">Maryland</option>
    <option value="21">Massachusetts</option>
    <option value="22">Michigan</option>
    <option value="23">Minnesota</option>
    <option value="24">Mississippi</option>
    <option value="25">Missouri</option>
    <option value="26">Montana</option>
    <option value="27">Nebraska</option>
    <option value="28">Nevada</option>
    <option value="29">New Hampshire</option>
    <option value="30">New Jersey</option>
    <option value="31">New Mexico</option>
    <option value="32">New York</option>
    <option value="33">North Carolina</option>
    <option value="34">North Dakota</option>
    <option value="35">Ohio</option>
    <option value="36">Oklahoma</option>
    <option value="37">Oregon</option>
    <option value="38">Pennsylvania</option>
    <option value="39">Rhode Island</option>
    <option value="40">South Carolina</option>
    <option value="41">South Dakota</option>
    <option value="42">Tennessee</option>
    <option value="43">Texas</option>
    <option value="44">Utah</option>
    <option value="45">Vermont</option>
    <option value="46">Virginia</option>
    <option value="47">Washington</option>
    <option value="48">West Virginia</option>
    <option value="49">Wisconsin</option>
    <option value="50">Wyoming</option>
    <option value="51">District of Columbia</option>
    </select></td>
    </tr>
    <tr>
    <td>City</td>
    <td><input type="text" name="cty" onBlur="chkcity();"/></td>
    </tr>
    <tr>
    <td>Zip Code </td>
    <td><input type="text" name="zpcd"/></td>
    </tr>
    </table>
    <input type="button" name="button" value="Pay for Membership"
    onclick="VerifyEntries()"/>
    </p>
    </form>
    </body>
    </html>

    >>>>>>>>>>> End HTML/JavaScript Page <<<<<<<<<<<<<


    >>>>>>>>>>> Start PHP Script <<<<<<<<<<<<<

    <?php
    $host = "my.server.net";
    $login = "loginname";
    $pwd = "password";
    $port = "";
    $db = "database";
    $fln = "table" ;
    $prma = $_REQUEST["stt"] ;
    $prmb = $_REQUEST["cty"] ;
    $host=$host.":".(integer)$port;
    $conn=mysql_connect($host,$login,$pwd) or die();
    $sql = "SELECT * FROM $fln WHERE stt='$prma' AND cty='$prmb'";
    mysql_select_db($db,$conn) ;
    $result = mysql_query($sql);
    $num_rows = mysql_num_rows($result);
    if ($num_rows==1) { echo "fou~~und" ; }
    else{ echo "dec~~ine" ; }
    ?>
    >>>>>>>>>>> End PHP Script <<<<<<<<<<<<<


    Ciao . . . C.Joseph

    That which a man buys too cheaply . . .
    He esteems too lightly
    C.Joseph Drayton, Mar 18, 2006
    #1
    1. Advertising

  2. C.Joseph Drayton

    Martyr2 Guest

    There is a few things I would test here. The first one being what your
    PHP script is giving back to you. Output the results of your PHP calls
    somewhere, make sure that PHP is giving you the values you expect. If
    the values are coming back correctly, then you can eliminate the
    problem being in the PHP script.

    However, if they are not coming out correctly, then check the inputs of
    the PHP script and make sure the correct values are being sent to the
    PHP script to begin with. The idea here is to eliminate the PHP script
    as the problem so you can focus on the Javascript.

    Second, being that it is not working the first time and then works the
    second tells me that something was set AFTER the first call to the
    javascript was made and that the second call is using that set value.
    The only value you are setting is the ctyfnd variable, which also
    happens to be attached to the alert you want to show.

    Make sure that the ctyfnd variable is being set correctly, it controls
    when your alert message shows. The setting of this variable depends on
    your result from the PHP script which is why I said make sure that the
    PHP script is returning the correct values you expect.

    One last thing, do remember that AJAX calls do not stop the flow of the
    original script and they are dependent on a server response. Meaning,
    you could also have timing issues where "result" may not contain what
    you expect when you do your indexOf operation at it.

    I think if you try these few ideas, you can quickly isolate the problem
    down. Let me know how it turns out. :)
    Martyr2, Mar 18, 2006
    #2
    1. Advertising

  3. Hi Martyr2,

    The PHP script is definitely returning the correct value.

    In my sidebar in FireFox v1.5 displayed, I can see the correct value
    from the PHP script come in on the first click.

    I am going to try your timing idea to see if that is it.

    Thanks for the suggestion.

    Ciao . . . C.Joseph

    That which a man buys too cheaply . . .
    He esteems too lightly

    Martyr2 wrote:
    > There is a few things I would test here. The first one being what your
    > PHP script is giving back to you. Output the results of your PHP calls
    > somewhere, make sure that PHP is giving you the values you expect. If
    > the values are coming back correctly, then you can eliminate the
    > problem being in the PHP script.
    >
    > However, if they are not coming out correctly, then check the inputs of
    > the PHP script and make sure the correct values are being sent to the
    > PHP script to begin with. The idea here is to eliminate the PHP script
    > as the problem so you can focus on the Javascript.
    >
    > Second, being that it is not working the first time and then works the
    > second tells me that something was set AFTER the first call to the
    > javascript was made and that the second call is using that set value.
    > The only value you are setting is the ctyfnd variable, which also
    > happens to be attached to the alert you want to show.
    >
    > Make sure that the ctyfnd variable is being set correctly, it controls
    > when your alert message shows. The setting of this variable depends on
    > your result from the PHP script which is why I said make sure that the
    > PHP script is returning the correct values you expect.
    >
    > One last thing, do remember that AJAX calls do not stop the flow of the
    > original script and they are dependent on a server response. Meaning,
    > you could also have timing issues where "result" may not contain what
    > you expect when you do your indexOf operation at it.
    >
    > I think if you try these few ideas, you can quickly isolate the problem
    > down. Let me know how it turns out. :)
    >
    C.Joseph Drayton, Mar 18, 2006
    #3
  4. Hi Martyr2,

    You were right it is a timing issue. I put in a timer set to 5
    seconds and the JavaScript function works perfectly. I will need to
    figure out exactly what to set the timer to for optimum performance,
    but your idea saved the day.

    Thanks much!!

    Ciao . . . C.Joseph

    That which a man buys too cheaply . . .
    He esteems too lightly

    Martyr2 wrote:
    > There is a few things I would test here. The first one being what your
    > PHP script is giving back to you. Output the results of your PHP calls
    > somewhere, make sure that PHP is giving you the values you expect. If
    > the values are coming back correctly, then you can eliminate the
    > problem being in the PHP script.
    >
    > However, if they are not coming out correctly, then check the inputs of
    > the PHP script and make sure the correct values are being sent to the
    > PHP script to begin with. The idea here is to eliminate the PHP script
    > as the problem so you can focus on the Javascript.
    >
    > Second, being that it is not working the first time and then works the
    > second tells me that something was set AFTER the first call to the
    > javascript was made and that the second call is using that set value.
    > The only value you are setting is the ctyfnd variable, which also
    > happens to be attached to the alert you want to show.
    >
    > Make sure that the ctyfnd variable is being set correctly, it controls
    > when your alert message shows. The setting of this variable depends on
    > your result from the PHP script which is why I said make sure that the
    > PHP script is returning the correct values you expect.
    >
    > One last thing, do remember that AJAX calls do not stop the flow of the
    > original script and they are dependent on a server response. Meaning,
    > you could also have timing issues where "result" may not contain what
    > you expect when you do your indexOf operation at it.
    >
    > I think if you try these few ideas, you can quickly isolate the problem
    > down. Let me know how it turns out. :)
    >
    C.Joseph Drayton, Mar 18, 2006
    #4
  5. Hi Martyr2,

    It is a timing problem, but it appears that my timing loop actually
    doesn't work. It seems that what was causing the pause was the alert
    that I was displaying. So how do I actually do a pause?

    Ciao . . . C.Joseph

    That which a man buys too cheaply . . .
    He esteems too lightly

    C.Joseph Drayton wrote:
    > Hi Martyr2,
    >
    > You were right it is a timing issue. I put in a timer set to 5
    > seconds and the JavaScript function works perfectly. I will need to
    > figure out exactly what to set the timer to for optimum performance,
    > but your idea saved the day.
    >
    > Thanks much!!
    >
    > Ciao . . . C.Joseph
    >
    > That which a man buys too cheaply . . .
    > He esteems too lightly
    >
    > Martyr2 wrote:
    >
    >>There is a few things I would test here. The first one being what your
    >>PHP script is giving back to you. Output the results of your PHP calls
    >>somewhere, make sure that PHP is giving you the values you expect. If
    >>the values are coming back correctly, then you can eliminate the
    >>problem being in the PHP script.
    >>
    >>However, if they are not coming out correctly, then check the inputs of
    >>the PHP script and make sure the correct values are being sent to the
    >>PHP script to begin with. The idea here is to eliminate the PHP script
    >>as the problem so you can focus on the Javascript.
    >>
    >>Second, being that it is not working the first time and then works the
    >>second tells me that something was set AFTER the first call to the
    >>javascript was made and that the second call is using that set value.
    >>The only value you are setting is the ctyfnd variable, which also
    >>happens to be attached to the alert you want to show.
    >>
    >>Make sure that the ctyfnd variable is being set correctly, it controls
    >>when your alert message shows. The setting of this variable depends on
    >>your result from the PHP script which is why I said make sure that the
    >>PHP script is returning the correct values you expect.
    >>
    >>One last thing, do remember that AJAX calls do not stop the flow of the
    >>original script and they are dependent on a server response. Meaning,
    >>you could also have timing issues where "result" may not contain what
    >>you expect when you do your indexOf operation at it.
    >>
    >>I think if you try these few ideas, you can quickly isolate the problem
    >>down. Let me know how it turns out. :)
    >>
    C.Joseph Drayton, Mar 18, 2006
    #5
  6. C.Joseph Drayton

    Randy Webb Guest

    C.Joseph Drayton said the following on 3/18/2006 1:26 PM:
    > Hi Martyr2,
    >
    > You were right it is a timing issue. I put in a timer set to 5
    > seconds and the JavaScript function works perfectly. I will need to
    > figure out exactly what to set the timer to for optimum performance,
    > but your idea saved the day.


    You will never be able to figure out "exactly what to set the timer" to
    because there are too many things that you can't know about at the time
    you set the timer. Do you give me a short timer because I am on a Cable
    connection or do you give me a long timer because I have dialup?

    The solution is to have two functions. One that retrieves the data, the
    second deals with the data.

    Then, in your PHP script you add a call to the second function at the
    end of the data. Then that function *only* gets called after the data is
    loaded and you have no need to try to guess how long to wait to process
    the data.

    --
    Randy
    comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
    Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
    Randy Webb, Mar 18, 2006
    #6
  7. Hi Randy,

    I put the following code in to verify that the result has returned,
    and I get a too many recursions error.

    function WaitForData()
    {
    if (result==null || result=="") { WaitForData(); }
    }

    Ciao . . . C.Joseph

    That which a man buys too cheaply . . .
    He esteems too lightly

    Randy Webb wrote:
    > C.Joseph Drayton said the following on 3/18/2006 1:26 PM:
    >
    >>Hi Martyr2,
    >>
    >>You were right it is a timing issue. I put in a timer set to 5
    >>seconds and the JavaScript function works perfectly. I will need to
    >>figure out exactly what to set the timer to for optimum performance,
    >>but your idea saved the day.

    >
    >
    > You will never be able to figure out "exactly what to set the timer" to
    > because there are too many things that you can't know about at the time
    > you set the timer. Do you give me a short timer because I am on a Cable
    > connection or do you give me a long timer because I have dialup?
    >
    > The solution is to have two functions. One that retrieves the data, the
    > second deals with the data.
    >
    > Then, in your PHP script you add a call to the second function at the
    > end of the data. Then that function *only* gets called after the data is
    > loaded and you have no need to try to guess how long to wait to process
    > the data.
    >
    C.Joseph Drayton, Mar 19, 2006
    #7
  8. C.Joseph Drayton

    Randy Webb Guest

    C.Joseph Drayton said the following on 3/19/2006 9:12 AM:

    I wish you would learn how to post properly here. Read the FAQ and
    please stop top-posting.

    Answer:It destroys the order of the conversation
    Question: Why?
    Answer: Top-Posting.
    Question: Whats the most annoying thing on Usenet?

    > Hi Randy,
    >
    > I put the following code in to verify that the result has returned,
    > and I get a too many recursions error.


    And I said nothing about a WaitForData function. I said to add a call at
    the end of your data file to call a second function. That method works,
    is proven to work cross-browser and will remain a valid/reliable way to
    ensure there is no timing issue.

    > function WaitForData()
    > {
    > if (result==null || result=="") { WaitForData(); }
    > }


    I bet if your data stream was empty that would work real well.

    Now, please read again the solution I gave you.

    function getData(){
    //this function retrieves the data.
    //make the data JS form. Either JSON or
    //some other form of Javascript code
    //Then, you dynamically load it as a script
    //element. Search the archives for that one.
    }

    function processData(){
    //this function processes the data that
    //was loaded by getData(). This function
    //gets called by the data loaded by getData
    //and will never get called before the data
    //gets loaded but will *always* get called
    //as soon as the data is loaded.
    }

    sample data file:

    //lots of JS data/code here
    processData();

    processData() would be the very last line of the data retrieved, and
    dynamically inserted, by the getData() function.

    > Randy Webb wrote:


    <snip>

    >> The solution is to have two functions. One that retrieves the data, the
    >> second deals with the data.
    >>
    >> Then, in your PHP script you add a call to the second function at the
    >> end of the data. Then that function *only* gets called after the data is
    >> loaded and you have no need to try to guess how long to wait to process
    >> the data.
    >>


    --
    Randy
    comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
    Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
    Randy Webb, Mar 19, 2006
    #8
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Rajive Narain
    Replies:
    0
    Views:
    1,478
    Rajive Narain
    Sep 18, 2009
  2. Leszek
    Replies:
    1
    Views:
    83
    Christophe HENRY
    Feb 4, 2006
  3. eastcoastguyz
    Replies:
    1
    Views:
    92
    Flamer
    Jul 11, 2006
  4. Replies:
    3
    Views:
    185
    frothpoker
    Sep 4, 2006
  5. __
    Replies:
    1
    Views:
    105
    Gregor Kofler
    Oct 2, 2007
Loading...

Share This Page