Tell me more ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.

I have html form with three values fname,lname,age. I want to send it on server side php file and insert into database.

My html form is like this:

<html>
<head>
<script>
function insert(fname,lname,age)
{

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==4 && xmlhttp.status==200)
    {
    document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    }
  }

xmlhttp.open("GET","ajax_db_php.php?fname=fname&lname=lname&age=age",true);
xmlhttp.send();
}
</script>
</head>
<body>
<form>
<table>

<tr><td>First Name : </td><td> <input type="text" fname="fname"/> </td> </tr>
<tr><td>Last Name : </td><td> <input type="text" fname="lname"/> </td> </tr>
<tr><td>City : </td><td> <input type="text" fname="age"/> </td> </tr>

<input type="submit" onclick="insert(fname,lname,age)">

</table>
</form>
</body>
</html>

As I have used ajax it should not load entire page, but when I click submit button it load entire page. why? And php page which receives values and insert into database is:

<html>
<body>

<?php

$fname=$_GET['fname'];
$lname=$_GET['lname'];
$age=$_GET['age'];

//echo "firstname : " $fname;

$con=mysqli_connect('127.0.0.1:3306' ,'root','root','my_db');
if (mysqli_connect_errno())
  {
  echo "Failed to connect to MySQL: " . mysqli_connect_error();
  }


$sql="INSERT INTO table1 (fname, lname, age)
VALUES
('$_POST[fname]','$_POST[lname]','$_POST[age]')";

$result=mysql_query($sql);

if (!mysqli_query($con,$sql))
  {
  die('Error: ' . mysqli_error($con));
  }
echo "1 record added";
mysqli_close($con);


?>

</body>
</html>

When I click the submit button it shows nothing, no error and no update in database too.

share|improve this question

closed as too localized by John Conde, Fabio, tereško, Jeremy, cspray Jun 16 at 14:55

This question is unlikely to help any future visitors; it is only relevant to a small geographic area, a specific moment in time, or an extraordinarily narrow situation that is not generally applicable to the worldwide audience of the internet. For help making this question more broadly applicable, visit the help center.If this question can be reworded to fit the rules in the help center, please edit the question.

up vote 0 down vote accepted

Change as said by Nikola then Change in HTML

input type="submit" 

to

input type="button"

This will not reload the page. Then Remove below tags from PHP

<html>
<body>
</html>
</body>

I'll recommend use jQuery to make ajax calls.

Update how to use ajax and serialize:

This is test.php

<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.1.min.js" ></script>
<script>
$(document).ready(function(){
    $("form").on('submit',function(event){
    event.preventDefault();
        alert("Hello");
        data = $(this).serialize();

        $.ajax({
        type: "GET",
        url: "test2.php",
        data: data
        }).done(function( msg ) {
        alert( "Data Saved: " + msg );
        });
    });
});
</script>
</head>
<body>
<form>
<table>

<tr><td>First Name : </td><td> <input type="text" name="fname"/> </td> </tr>
<tr><td>Last Name : </td><td> <input type="text" name="lname"/> </td> </tr>
<tr><td>City : </td><td> <input type="text" name="age"/> </td> </tr>

<input type="submit" value="Submit" />

</table>
</form>
</body>
</html>

this is test2.php

<?php
if($_GET)
{
$fname=$_GET['fname'];
$lname=$_GET['lname'];
$age=$_GET['age'];

echo "firstname : ".$fname;
}
?>
share|improve this answer
@ Vivek: This does not make any change! Same problem yet. Reloadin problem solved but main prob still up! – Karimkhan Pathan Jun 16 at 14:45
1  
i think change this line xmlhttp.open("GET","ajax_db_php.php?fname=fname&lname=lname&age=age",true); as xmlhttp.open("GET","ajax_db_php.php?fname="+fname+"&lname="+lname+"&age="+age+",‌​true); – Vivek Muthal Jun 16 at 15:02
Same problem yet! – Karimkhan Pathan Jun 16 at 15:07
your code seems fine, are you sure ajax call is made to server? use jquery to make ajax calls. See here api.jquery.com/jQuery.ajax – Vivek Muthal Jun 16 at 15:10
1  
yes, i have not written database code. It's will alert "Hello" then ajax call is made then it will alert "fname" cause in php i am echoing it fname. Your ajax is not working try with different browser. the above code work's fine at my end. – Vivek Muthal Jun 17 at 3:59
show 6 more comments

You set $fname, $lname and $age correctly, but you never use them, instead of that you use $_POST variables which do not exist.

Instead of ('$_POST[fname]','$_POST[lname]','$_POST[age]')";

you should use the $_GET variables e.g.

('$fname','$lname','$age')";


I'd also suggest you to escape the strings when adding them to the database. One possible solution can be Prepared statements.

share|improve this answer
@ Nikola: I updated it : $sql="INSERT INTO table1 (fname, lname, age) VALUES ('$_GET[fname]','$_GET[lname]','$_GET[age]')"; But not change! – Karimkhan Pathan Jun 16 at 13:58

Not the answer you're looking for? Browse other questions tagged or ask your own question.