4

How do i update mysql database with ajax and php with no page refresh

3 Answers 3

10

Here is a good example, it shows a SELECT statement but it should be straight forward and easy to update the script to what you need.

HTML from the example page:

<html>
    <head>
        <script src="selectuser.js"></script>
    </head>
    <body>

        <form> 
            Select a User:
            <select name="users" onchange="showUser(this.value)">
                <option value="1">Peter Griffin</option>
                <option value="2">Lois Griffin</option>
                <option value="3">Glenn Quagmire</option>
                <option value="4">Joseph Swanson</option>
            </select>
        </form>

        <p>
        <div id="txtHint"><b>User info will be listed here.</b></div>
    </p>

</body>
</html>

javaScript:

var xmlHttp;

function showUser(str)
{ 
    xmlHttp=GetXmlHttpObject();
    if (xmlHttp==null)
    {
        alert ("Browser does not support HTTP Request");
        return;
    }
    var url="getuser.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;
}

PHP called by Ajax:

<?php
$q = $_GET["q"];

$con = mysql_connect('localhost', 'peter', 'abc123');
if (!$con) {
    die('Could not connect: ' . mysql_error());
}

mysql_select_db("ajax_demo", $con);

$sql = "SELECT * FROM user WHERE id = '" . $q . "'";

$result = mysql_query($sql);

echo "<table border='1'>
    <tr>
    <th>Firstname</th>
    <th>Lastname</th>
    <th>Age</th>
    <th>Hometown</th>
    <th>Job</th>
    </tr>";

while ($row = mysql_fetch_array($result)) {
    echo "<tr>";
    echo "<td>" . $row['FirstName'] . "</td>";
    echo "<td>" . $row['LastName'] . "</td>";
    echo "<td>" . $row['Age'] . "</td>";
    echo "<td>" . $row['Hometown'] . "</td>";
    echo "<td>" . $row['Job'] . "</td>";
    echo "</tr>";
}
echo "</table>";

mysql_close($con);

?>
Sign up to request clarification or add additional context in comments.

2 Comments

I would also add some validation before doing any SQL query on user given values.
I guess, the guy wants is to UPDATE statement with POST method to WRITE into database and not READ.
5

You can use the JQuery library and do something like

$.ajax({
   type: "POST",
   url: "some.php",
   data: "name=John&location=Boston",
   success: function(msg){
     alert( "Data Saved: " + msg );
   }
 });

In your some.php file have something like this:

<?php

$name = $_POST['name'];
$location = $_POST['location'];

$query("your insert query");

$result = mysql_query($query);

?>

?>

Comments

1

http://www.w3schools.com/PHP/php_ajax_database.asp explains it quite nicely.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.