auto fill second textbox with the input of first textbox. Like if I choose Jane as first name I want the second textbox to retrieve the last name from database and auto fill it with Doe. I am getting no auto input on second textbox not sure what I am doing wrong.
Here is the test.php code
<?php
?>
<script src="jquery-1.11.1.min.js"></script>
<script>
$(document).ready(function(){
$("#firstName").change(function(){
var firstName=$(this).val();
if(firstName != ''){
$.ajax({
type:"post",
url:"insert_process.php",
data:"firstName="+firstName,
datatype:"json",
success:function(data){ $("#lastname").val(data);
$('#ename').css( "background-color","#B3CBD6" )
$('#ename').animate({backgroundColor: "#fff",});
}
});
}
else{
$("#lastname").val("");
}
});
});
</script>
<!DOCTYPE html>
<html>
<head>
<title>Systems Request </title>
</head>
<body>
<div align="center">
<form action = "insert.php" method ="post" class="form" style="width: 285px; height: 192px">
<br><br>First Name<br>
<input type="text" id="firstName" name="firstName">
<br> Last Name<br>
<input type="text" id="lastname" name="lastname" ><br><br>
<input type="submit" value= "Submit Name "><br>
</form>
</div>
</body>
</html>and then here is insert_proccess.php code
<?php
header('Content-Type: application/json');
$host = "localhost";
$user = "root";
$db_name= "people";
$pass= "systems399";
$con = mysql_connect($host, $user, $pass);
$db_conx=mysql_select_db("people", $con);
$fname= $_POST["firstName"];
$sql="SELECT * FROM names WHERE firstName='$fname' ";
$query= mysqli_query($db_conx, $sql);
$row = mysqli_fetch_array($query2 MYSQLI_ASSOC);
$rc = $row["lastname"];
echo json_encode ($rc);
?></div>
Is the request actually being sent (you can checking the networking tab)? Can you alert the returned data? Basically to be more helpful I would need more information on where exactly the process is failing, at a quick glance, try setting up your data structure more like this:
data: { "firstName": firstName }