Autocompleting textboxes with AJAX using variables from a PHP file - php

Question

I am doing a project where I need to make sure that my form instantly autofills 2 textboxes based on input from the first textbox. Right now I am just testing. I can't use database entries to populate my form, only PHP variables. My logic needs to be like this: user types in a specific 10 digit number into a textbox on my form (specified in a PHP file), then the other two textboxes get autofilled with specific entries after an AJAX call to that PHP file. This is definitely one of the more complex tasks that I've encountered so far (noob). My code doesn't work, so I would really appreciate any help with getting it to function properly.
HTML is like this:
<!--load scripts, libraries, etc.-->
<form method="GET">
Number: <input type="text" name="num" id="num">
First Name: <input type="text" name="first" id="first">
Last Name: <input tupe="text" name"last" id="last">
</form>
PHP:
<?php
$num=$_GET["num"];
$first=$_GET["first"];
$last=$_GET["last"];
if ($num=="0123456789")
{
$fill = array(
'firstname' => $first["John"],
'lastname' => $last["Smith"],
);
echo json_encode($fill);
}
else
{
echo "Bad input.";
}
?>
jQuery:
$(document).ready(function () {
$("#num").keyup(function () {
var el = $(this);
if (el.val().length === 10) {
$.ajax({
url: "http://localhost/test.php",
cache: false,
dataType: "json",
type: "GET",
data: "npi=" + el.val(),
success: function (result) {
$("#first").val(result.firstname);
$("#last").val(result.lastname);
}
});
}
});
});

Answer 1

in ajax change like this it'll be easy to understand
type: "GET",
data:{num: el.val()},//if multiple then like this->data:{attr:val1,attr2:val2,...},
in php
<?php
$first["John"]="john";//i hope you have these two values defined
$last["Smith"]="smith";
$num=$_GET["num"];
if ($num=="0123456789")
{
$fill = array(
'firstname' => $first["John"],
'lastname' => $last["Smith"],
);
echo json_encode($fill);
}
else
{
echo "Bad input.";
}
?>
explanation
see the process is like
first the number will go to php with the help of ajax(through the
ajax request)
type: "GET",,
data: {num: el.val()},
so as we are sending the number as GET request to php, in php we get this number with $_GET['num'] so now this value will have 0123456789 value in it.
now we are checking with if condition in php
if ($num=="0123456789")
{
//here we need to send the firstname and lastname values BACK TO THE AJAX REQUEST
so we need to have these first and last names here in php defined somewhere manually or get it from database(if you have these first,last names in DB)
echo json_encode($fill);
}