How to autofill other form fields upon click with PHP

I have a simple form right now:

<form action='<? echo $PHP_SELF;?>' method='POST'>
Username:<input type='text' name='username'><br>
Email:<input type='text' name='email'><br>
Posts:<input type='text' name='posts'><br>
Joindate<input type='text' name='join'><br>
<input type="submit" value="Submit" />

What I need is, when the user fills his username and does one of the following: 1.presses tab 2.Presses enter 3.clicks on a fetch button(fetch button does not exist now,i would like to know how to create it using javascript or anything else that suits my criteria)

Once he does any of the above it should automatically generate the remaining fields from the database. The query would look like this: $qry=mysql_query("SELECT * from user where username =$_POST['username']"); $row=mysql_fetch_assoc('$qry); echo $row['posts] and so on..

After it is autogenerated he can edit the fields and submit to update the database fields.

Here is my updated code:

<head>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/redmond/jquery-ui.css">

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>

</head>

<form action="<?php echo $_SERVER['PHP_SELF']; ?>"  method="POST">
<fieldset>
<legend>Form</legend>
<label for="username">Username: </label>

<input type="text" id="username"  name="username" /> 
<button onclick="myrequest()">fetch</button>
<label for="posts">Posts: </label>
<input type="text" id="posts" name="posts"  size="20"/>
<label for="joindate">Joindate: </label>
<input type="text" id="joindate" name="joindate"  size="20"/>



<p><input type="submit" name="submitBtn" value="Submit" /></p>

</fieldset>
</form>
<script type="javascript/text>
function myrequest() {
var name = $('.username').val();
$.ajax({
  method: "GET",
  url: "http://url.com/test/autofill.php",
  dataType: 'json',
  data: {
    username: username
  }).success(function( responseObject ) {
    // assuming you have an array of stuff like name, id, email, etc.
    // now i populate another field from the ajax response
    $('.posts').val( responseObject.posts );
  });

} 
And then in the autofill.php

    //connect to database
    $name = $_GET['username'];
    $return = mysql_query("SELECT * FROM user WHERE username = '$name' LIMIT 1");
    $rows = mysql_fetch_array($return);
    $formattedData = json_encode($rows);
    print $formattedData;

Make a php endpoint (basically a url in which you can call your special php function, which returns only the data you want) that returns a json_encode'd array with all of the other fields' info.

Call that function via ajax when the first field either loses focus or changes (or a button is pressed), depending on your preference.

Then using javascript, use what you've gotten back from the ajax response to populate the other fields.

autoFill.php

$name = $_GET['name'];
$return = mysql_query("SELECT * FROM someTable WHERE username = '$name' LIMIT 1");
$rows = mysql_fetch_array($return);
$formattedData = json_encode($rows);
print $formattedData;

Javascript (using jquery) //gets the val from the first field

$(document).ready(function() {
    function myrequest(e) {
        var name = $('.username').val();
        $.ajax({
            method: "GET",
            url: "/echo/json/", /* online, change this to your real url */
            data: {
                username: name
            },
            success: function( responseObject ) {
                alert('success');
                $('#posts').val( 'posts' );
                $('#joindate').val('testing join date');
                /*
                once you've gotten your ajax to work, then go through and replace these dummy vals with responseObject.whatever
                */
            },
            failure: function() {
                alert('fail');
            }
        });
    }

    $('#fetchFields').click(function(e) {
        e.preventDefault();
        myrequest();
    });
});

来源：https://stackoverflow.com/questions/9007123/how-to-autofill-other-form-fields-upon-click-with-php

标签

php

autofill