user1582396 user1582396 - 3 months ago 14
Ajax Question

PHP: how to populate html form fields with query results using ajax

I'm trying to populate a form with values after performing a simple search but when I run the script, I either get "undefined" or a blank response when I do alert(data);.

search.php

<?php
include_once 'config/config.php';
include_once 'config/connect.php';
$conn = dbconn();

if(isset($_POST['btn-search']))
{
$sub_id = mysqli_real_escape_string($conn, $_POST['user_id']);
$sql = "SELECT * FROM users WHERE user_id = '".$sub_id."'";
$res = mysqli_query($conn, $sql);
$row = mysqli_fetch_array($res);

$found = array();
while ($row = mysqli_fetch_array($res))
{
$found[] = array(
'name' => $row['full_name'],
'init_date' => $row['init_date'],
'position' => $row['position'],
'email' => $row['email'],
);
echo json_encode($found);
}
}
mysqli_close($conn);
?>


script

<script>
/*
simple validation script
*/

$('document').ready(function()
{
$('#register-submit-btn').attr('disabled', 'disabled');
/* validation */
$("#register-form").validate({
rules:
{
user_id: {
required: true,
minlength: 5,
},
},
messages:
{
cedulaid:{
required: "The user ID is required",
minlength: "The user ID should be no less than 5 characeters long.",
},
},
submitHandler: submitForm
});
/* validation */

/* get data */
function submitForm()
{
var data = $("#details-form").serialize();

$.ajax({
type : 'POST',
url : 'search.php',
data : data,
beforeSend: function()
{
$("#detailsmsg").fadeOut();
$("#btn-search").html('<img src="include/btn-ajax-loader.gif" /> &nbsp; Looking...');
$('#btn-search').attr('disabled', 'disabled');
},
success : function(data)
{
alert(data);
$("#detailsmsg").fadeIn(1000, function(){
$("#detailsmsg").removeClass("alert-danger").addClass("alert-success");
$('#btn-search').removeAttr('disabled');
$("#btn-search").html('Search again?');
$('#register-submit-btn').removeAttr('disabled');
$("#detailsmsg").html("<span>Data Found</span>");

});
$("#name").val(data.name); // not sure how to do this part. this is probably very wrong but still not getting anything on the alert.
$("#init_date").val(data.init_date);
$("#position").val(data.position);
$("#email").val(data.email);
}
});
return false;
}
/* get data */
});
</script>


I have the alert(data) at the top of the success function because I want to see what I would get in return but it comes back blank. If I do alert(data[0]) I get "undefined" message.

the console POST returns this:

name=&init_date=&position=&email=


There are probably many mistakes in the script and I'm open to any feedback and help I can get. Let me know if any other details are needed.

Thanks in advance,

Answer

for getting single output, you only need a $row = mysqli_fetch_array($res); not loop..it will return single parameter output..

Search.php

<?php
include_once 'config/config.php';
include_once 'config/connect.php';
$conn = dbconn();

if(isset($_POST['btn-search']))
{
    $sub_id = mysqli_real_escape_string($conn, $_POST['user_id']);
    $sql = "SELECT * FROM users WHERE user_id = '".$sub_id."'";
    $res = mysqli_query($conn, $sql);
    $row = mysqli_fetch_array($res);

    $found = array();

        $found[] = array(
            'name' => $row['full_name'],
            'init_date' => $row['init_date'],
            'position' => $row['position'],
            'email' => $row['email'],
        );
        echo json_encode($found);

}
mysqli_close($conn);
?>

try it once..may be it will help you.