CODEWITHSUNDEEP
phpjquery
Monkey King
Monkey King

Reputation: 71

best way to populate an input field with data from an SQL query?

I have a form which populates 3 fields based on the selection from an autocomplete field. That is fine and working well, however I have a 4th field which needs to be populated automatically based upon one one of the fields that got populated automatically by the autocomplete.

what's the best way to populate that 4th field?

here is my code in main:

<script type="text/javascript">
$().ready(function() {
    $("#PartNumberID").autocomplete({
    source: "ajax/getData.php",
    minLength: 6,
    delay: 100,
    select: function(event, ui) {
         $("#loadingIcon").show();
         $("#PartNumberID").val(ui.item.value);
         $("#BoxID").val(ui.item.dietype);
         $("#PackageID").val(ui.item.pkg);
         $("#loadingIcon").fadeOut();
    },
    change: function(event, ui){
         $("#ProcessID").val("RESULT FROM SQL STATEMENT USING BoxID GOES HERE");
    }
    });
});
</script>

here is my file called process.php which will get the process if you pass the GET var of box, i just need to figure how to send the box var and get the result of this file and put it in the input field:

<?php
require_once '../includes/conn.php';
$sql=mysql_query("SELECT PROCESS FROM data WHERE `box` = \"".$_GET['box']."\" GROUP BY PROCESS") or die("mysql error".mysql_error());
$part['process']=mysql_result($sql,0);
$parts[]=$part;
echo json_encode($parts);
?>

Upvotes: 1

Views: 922

Answers (2)

Liam Bailey
Liam Bailey

Reputation: 5905

It would be helpful to see the JSON result, but this is basically what you need.

    $(document).ready(function() {
        $("#PartNumberID").autocomplete({
        source: "ajax/getData.php",
        minLength: 6,
        delay: 100,
        select: function(event, ui) {
             $("#loadingIcon").show();
             $("#PartNumberID").val(ui.item.value);
             $("#BoxID").val(ui.item.dietype);

             $("#PackageID").val(ui.item.pkg);
             $("#loadingIcon").fadeOut();
        },
change: function(event, ui)
{
$.ajax({
    type: 'GET',
    data: '?box=' . ui.item.dietype,
    url: 'process.php',
    success: function(data)
    {
    $.each(data) {
    $("#ProcessID").val(this.process);
    }
    }
    })
}

        });
    });

Upvotes: 0

Paul Creasey
Paul Creasey

Reputation: 28864

Something like this..

change: function(event, ui){
         $.get('ajax/boxQuery.php?box='+$("#BoxID").val,
               function(result){
                      $("#ProcessID").val(result);
               }
    }

I used $("#BoxID").val but really you should use the ui argument, i just don't know of the top of my head what the correct syntax would be.

Upvotes: 1

Related Questions