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.
Page 1 of 2 12 LastLast
Results 1 to 15 of 16
  1. #1
    New to the CF scene
    Join Date
    Sep 2006
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    refresing page without reload using ajax and php

    I want to make a comment for visitors where they can add comments and it will get updated without refreshing .

    I have gone though a lot of tutorial but they dont tell how to code the .js file or .php file

    Please help.

  • #2
    Senior Coder A1ien51's Avatar
    Join Date
    Jun 2002
    Location
    Between DC and Baltimore In a Cave
    Posts
    2,717
    Thanks
    1
    Thanked 94 Times in 88 Posts
    what is hard about it?

    Making the request

    Code:
    var req;
    
    function SendData(name,comment) {
        var url = "yourPage.php";
        req = false;
        // branch for native XMLHttpRequest object
        if(window.XMLHttpRequest && !(window.ActiveXObject)) {
        	try {
    			req = new XMLHttpRequest();
            } catch(e) {
    			req = false;
            }
        // branch for IE/Windows ActiveX version
        } else if(window.ActiveXObject) {
           	try {
            	req = new ActiveXObject("Msxml2.XMLHTTP");
          	} catch(e) {
            	try {
              		req = new ActiveXObject("Microsoft.XMLHTTP");
            	} catch(e) {
              		req = false;
            	}
    		}
        }
    	if(req) {
                             var params = "name" + name + "&" + "comment=" + comment;
    		req.open("POST", url, true);
    		req.onreadystatechange = processReqChange;
    		req.send(params);
    	}
                 else{
                   //you need to do a normal form submission
                 }
    }
    So you would call that like
    SendData("Eric","Foo Bar Candy");


    Getting the request back you set the innerHTML with the responseText where you want it to show up.
    Code:
    function processReqChange() {
        // only if req shows "loaded"
        if (req.readyState == 4) {
            // only if "OK"
            if (req.status == 200) {
              document.getElementById("youroutputid").innerHTML = req.responseText;
            } else {
                alert("There was a problem retrieving the XML data:\n" +
                    req.statusText);
            }
        }
    }

    On the server

    You handle the Post like any other form submission and spit out the HTML that you want to show up. (I know almost zippo about php)

    Code:
    print "Your elephant's name is: " . $_POST['name'];
    Eric
    Tech Author [Ajax In Action, JavaScript: Visual Blueprint]

  • #3
    New to the CF scene
    Join Date
    Sep 2006
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    CAN U PLEASE EXPLAIN WHICH FILE IS .js and which one is php., as i am new to this...

  • #4
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,068
    Thanks
    0
    Thanked 256 Times in 252 Posts
    SendData() and processReqChange() are the javascript codes, they can be put in a .js file and the last code which is labeled "On the server" is the php.
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________

  • #5
    Regular Coder the-dream's Avatar
    Join Date
    Mar 2007
    Location
    Northamptonshire, UK
    Posts
    477
    Thanks
    8
    Thanked 4 Times in 4 Posts
    instead of

    PHP Code:
    print ""
    you should use
    PHP Code:
    echo ""

  • #6
    New Coder
    Join Date
    Mar 2007
    Posts
    17
    Thanks
    0
    Thanked 0 Times in 0 Posts
    hey i got the same problem but i cant fix it.. i tried the above but it dont help

    i got several files.. projecten.php, projecten.incl.php and selectuser.js and some more but u dont need them for the problem

    true AJAX i get a variable "q" (in projecten.php and he shows every think i want to see that works great now i want from another file to call the ajax (go to a new page with a link) and i send a POST or GET with it.. but then does the ajax dont pick it up.. does anybody got a solution here for?


    i now way it wound work. i call the file projecten.php with a variable in GET but i need to call selectuser.js with a var.. how can i do that with a link.. or somethink like that..?

    i hope u get the problem.. else just ask

    i will post the code below.. i hope u can find what i need to change


    selectuser.js
    Code:
    var xmlHttp
    
    function showUser(str)
    {
        xmlHttp=GetXmlHttpObject()
        if (xmlHttp==null)
         {
             alert ("Browser does not support HTTP Request")
             return
         }
        var url="includes/projecten.incl.php"
        url=url+"?q="+str
        url=url+"&sid="+Math.random()
        xmlHttp.onreadystatechange=stateChanged
        xmlHttp.open("GET",url,true)
        xmlHttp.send(null)
    }
    
    function stateChanged()
        {
            if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
                 {
                 document.getElementById("txtHint").innerHTML=xmlHttp.responseText
                 }
        }
    
    function GetXmlHttpObject()
        {
            var xmlHttp=null;
            try
                 {
                 // Firefox, Opera 8.0+, Safari
                 xmlHttp=new XMLHttpRequest();
                 }
            catch (e)
                 {
                 //Internet Explorer
                 try
                      {
                      xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
                      }
                 catch (e)
                      {
                      xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
                      }
                 }
            return xmlHttp;
        }
    projecten.incl.php
    Code:
    <?php     $project = $_GET['q'];  ?>
    
        <table border="0" >
            <tr>
                <td valign="top">
                    <?php include "projecten.project.php"; ?><br><br>
                    <?php     include "projecten.fase.php";    ?>
                </td >
                       
                <td valign="top">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
           
                <td valign="top">
                    <?php include "projecten.opmerking.php"; ?>
                </td>
           
            </tr>
        </table>
       
    <?php
        if ( $project !== "")
            {
                echo "<p>In de toekomst komen hier meerdere opties voor het project bij.</p>";
            }
        else {echo "<p>Selecteer een project</p>";}
    ?>
    projecten.php
    Code:
    <!doctype html public "-//W3C//DTD HTML 4.0 //EN">
    <html>
    <head>
    <script src="selectuser.js"></script>
    
    <LINK HREF="includes/stijl.css" REL="stylesheet" TYPE="text/css" MEDIA="screen, print">
           <title>Projecten</title>
    
    <SCRIPT LANGUAGE="JavaScript">
    <!-- Begin
    function popUp(URL) {
    day = new Date();
    id = day.getTime();
    eval("page" + id + " = window.open(URL, '" + id + "', 'toolbar=0,scrollbars=0,location=0,statusbar=0,menubar=0,resizable=0,width=300,height=220,left = 490,top = 362');");
    }
    // End -->
    </script>
    
    </head>
    <body>
    <h3>Projecten</h3>
    <br>
     
     
    <?php
    $project = $_GET['project'];
    $budget = $_GET['budget'];
    
     if     ( $_GET['date2'] == "" )
            {$date = $_GET['date'];}
     else     {$date = $_GET['date2'];}
    
    
    
    ?>
        <form method="get" action="projecten.php">
        <select name="project" onchange="showUser(this.value)">
        <option value="">Maak uw keuze</option>
    <?php
                 
        include "includes/connect_weekbrief.php";                    
        $query = "
                SELECT DISTINCT (projectuser.code) as code
                FROM projectuser
                WHERE     projectuser.user = 'planner'
                AND projectuser.id > '100'
                ORDER BY projectuser.code asc
                ";
       
        $sql = mysql_query($query) or die ( mysql_error( ) );       
    
        while($record = mysql_fetch_object($sql))     {       
                    $project_code = "$record->code";                  // project_code aanmaken
    
        echo "<option value=". $project_code .">Project: ".$project_code."</option>"; // alles neerzetten
                                                }   
        echo "</select></form>";
    
        echo "<p><div id=\"txtHint\">Hier zal informatie over het project komen.</div></p>";
    ?>
    </body>
    </html>
    Last edited by traxion; 03-13-2007 at 10:55 AM.

  • #7
    Senior Coder A1ien51's Avatar
    Join Date
    Jun 2002
    Location
    Between DC and Baltimore In a Cave
    Posts
    2,717
    Thanks
    1
    Thanked 94 Times in 88 Posts
    Look how I handle the response, you NEED to check for the status code. Open up Firefox and load Firebug [http://getfirebug.com/]. Watch the XMLHttpRequest.

    Eric
    Tech Author [Ajax In Action, JavaScript: Visual Blueprint]

  • #8
    New Coder
    Join Date
    Mar 2007
    Posts
    17
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by A1ien51 View Post
    Look how I handle the response, you NEED to check for the status code. Open up Firefox and load Firebug [http://getfirebug.com/]. Watch the XMLHttpRequest.

    Eric
    i tried to read the code.. and find it out by myself but i cant find it

    i did find out that i need to get the GET variable to the .js file.. if that can be done i can change the variable and the ajax will work

    so i got projecten.php?projecten=testproject

    now i need that variable to the selectuser.js file without doing anythink ( so i want to be compleetly automatic) do u now how i can do that?

  • #9
    Senior Coder A1ien51's Avatar
    Join Date
    Jun 2002
    Location
    Between DC and Baltimore In a Cave
    Posts
    2,717
    Thanks
    1
    Thanked 94 Times in 88 Posts
    Call the function with window.onload?

    Eric
    Tech Author [Ajax In Action, JavaScript: Visual Blueprint]

  • #10
    New Coder
    Join Date
    Mar 2007
    Posts
    17
    Thanks
    0
    Thanked 0 Times in 0 Posts
    i tried somethings with it but nothing worked, i looked on the web but what i saw from it i dont think that is the think i need.


    it could be that my code was to buggy it that way it dont worked.. but im afraid it is not what im looking for

  • #11
    Senior Coder A1ien51's Avatar
    Join Date
    Jun 2002
    Location
    Between DC and Baltimore In a Cave
    Posts
    2,717
    Thanks
    1
    Thanked 94 Times in 88 Posts
    I am not sure what you are talking about exactly.. am taking a guess that you want to call the function when the page load to load what ever is selected?

    The JavaScript would look something like:
    Code:
    window.onload = function()
      var sel = document.forms[0].project;
      showUser(sel.options[sel.selectedIndex].value);
    }
    Eric
    Tech Author [Ajax In Action, JavaScript: Visual Blueprint]

  • #12
    New Coder
    Join Date
    Mar 2007
    Posts
    17
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by A1ien51 View Post
    I am not sure what you are talking about exactly.. am taking a guess that you want to call the function when the page load to load what ever is selected?

    The JavaScript would look something like:
    Code:
    window.onload = function()
      var sel = document.forms[0].project;
      showUser(sel.options[sel.selectedIndex].value);
    }
    Eric
    uhm not realy i got that part working with ajax true a pull down list

    now i got some links on another page. when i press the link i want to go to

    http://localhost/planning/index.php?...&project=OCV27

    the page projecten (that works) and then i want to activate the ajax (automatic) and that the variable project into the ajax get so that ajax maken the stuff visable.

    i will try to set the page online so u can see it by ure self (uhm i cant do it now .. i will try it again to night.

    i hope u get the problem now.. else just ask

    thnx for the time u try to help me


    -------------------------

    update i fixed the problem

    $proj = $_GET['project'];
    if( isset( $proj ) )
    {
    echo"<script type=\"text/javascript\">showUser('" . $proj . "');</script>";
    }

    was the code i needed
    Last edited by traxion; 03-14-2007 at 10:06 AM.

  • #13
    New to the CF scene
    Join Date
    Jun 2008
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Relaod page for every user

    Hi


    How can we refresh a page for every user same like

    http://www.telebid.com/

    using ajax and php

    Anyone can help me with code /Sample


    Thanks
    Davinder

  • #14
    Senior Coder tomws's Avatar
    Join Date
    Nov 2007
    Location
    Arkansas
    Posts
    2,644
    Thanks
    29
    Thanked 330 Times in 326 Posts
    Quote Originally Posted by davinder16 View Post
    Anyone can help me with code /Sample
    There is a code sample in the 15-month old post to which you've replied.

  • #15
    New to the CF scene
    Join Date
    Jun 2008
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    can you tell me how can i

    Quote Originally Posted by tomws View Post
    There is a code sample in the 15-month old post to which you've replied.

    Plz help me .
    i want to refresh page using ajax periodically


    Thanks
    Last edited by davinder16; 06-04-2008 at 01:30 PM.


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

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