Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    Regular Coder
    Join Date
    May 2010
    Posts
    219
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Simple Ajax question

    I am not very familiar with AJax, and for simplicity sake, I am trying a simple code. When I click the text box it should change the text, but it did not change. Is there something wrong with the code? I know this can be done with out using AJAX, but I want to test AJAX.



    page1.php
    PHP Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <
    html>
    <
    head>
    <
    meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <
    title>AJAX TEST</title>


    <
    script type="text/javascript">
    function 
    box1(str)
    {

    if (
    str.length==0)
      {
      
    document.getElementById("box").innerHTML="";
      return;
      }
    if (
    window.XMLHttpRequest)
      {
    // code for IE7+, Firefox, Chrome, Opera, Safari
      
    xmlhttp=new XMLHttpRequest();
      }
    else
      {
    // code for IE6, IE5
      
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
    xmlhttp.onreadystatechange=function()
      {
      if (
    xmlhttp.readyState==&& xmlhttp.status==200)
        {
        
    document.getElementById("box").innerHTML=xmlhttp.responseText;
        }
      }
    xmlhttp.open("GET","addtruck.php);
    xmlhttp.send();
    }
    </script>
    </head>
    <body>

    <input type="
    text" size="10" onClick="box1()">
    <span id="
    box">this should change</span>

    </body>

    </html> 

    addtruck.php

    PHP Code:
    <?php


    echo "hello there";

    ?>

  • #2
    New Coder
    Join Date
    Jun 2005
    Posts
    52
    Thanks
    0
    Thanked 4 Times in 4 Posts
    Code:
    xmlhttp.open("GET","addtruck.php);
    ... should be...

    Code:
    xmlhttp.open("GET","addtruck.php");
    ;O

  • #3
    Regular Coder
    Join Date
    Aug 2010
    Posts
    974
    Thanks
    19
    Thanked 212 Times in 210 Posts
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>AJAX TEST</title>
    
    <script type="text/javascript">
    
    req = 
            (function () {
                if (window.XMLHttpRequest) {
                    return function () {
                        return new XMLHttpRequest();
                    };
                } else if (window.ActiveXObject) {
                    /*@cc_on@*/
                    /*@if (@_jscript_version >= 5)
                    try {
                        return function () {
                            return new ActiveXObject("Msxml2.XMLHTTP");
                        };
                    } catch (e) {
                        try {
                            return function () {
                                return new ActiveXObject("Microsoft.XMLHTTP");
                            };
                        } catch (E) {
                            return function () {
                                return function () { null };
                            };
                        }
                    }
                    @end@*/
                }
            })();
    
    xmlhttp=req()
    xmlhttp.onreadystatechange=function()
      {
      if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
        document.getElementById('box').innerHTML=xmlhttp.responseText;
        }
      }
    xmlhttp.open("GET","addtruck.php",true);
    
    
    
    function box1(str)
    {
    if (str.length==0)
      {
      return;
      }
    
    xmlhttp.send(null);
    }
    </script>
    
    </head>
    <body>
    
    <input type="text" size="10" onClick="box1(value)">
    <span id="box">this should change</span>
    
    </body>
    
    
    </html>
    Last edited by DaveyErwin; 10-16-2010 at 02:01 PM.

  • #4
    Regular Coder
    Join Date
    May 2010
    Posts
    219
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks for the reply,


    Now I am trying AJAX with the html select, but it does not work, tested the code without out select it works, but with selectit does not dynamically display the select with option values.

    html code

    Code:
    <select name="typeoftruck">
    
    <div id='addlist'></div>        
    </select>


    addtruck.php
    PHP Code:
    <?php
    session_start
    ();
    //connect to the database
    $db=mysql_connect ("localhost""root") or die ('I cannot connect to the database because: ' mysql_error()); 
    //-select the database to use
    $mydb=mysql_select_db("infodata");
    $str2 $_GET['q'];

    $sql="insert into truckdropdown(trucklist) values('$str2') ";
    $result=mysql_query($sql);


    $sql="SELECT trucklist from truckdropdown ";
    $result=mysql_query($sql);
    while(
    $row=mysql_fetch_array($result)){
    $truckvar=$row['trucklist'];
    echo 
    "<option value=''>".$truckvar."</option>";
    }


    ?>
    Last edited by Anishgiri; 10-17-2010 at 12:22 AM.

  • #5
    New Coder
    Join Date
    Jun 2005
    Posts
    52
    Thanks
    0
    Thanked 4 Times in 4 Posts
    Assuming you're going to do something like...

    Code:
    document.getElementById('addlist').innerHTML = xhr.responseText;
    Try changing the HTML to this...

    Code:
    <select id="addlist" name="typeoftruck"></select>

  • #6
    Regular Coder
    Join Date
    May 2010
    Posts
    219
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Now it works, thanks.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •