Home/ Questions/Q 6234615
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-24T10:31:03+00:00

A friend recently introduced me to jquery and now I’d like to use it

  • 0

A friend recently introduced me to jquery and now I’d like to use it rewrite and develop a inventory web application.

My original app consisted of a simple web page that required you to enter an id number and click a button. The id number is passed to a php file via the post method. The php file queries a database and displays the results in a table.

I created a HTML form that I would like to use update, enter new records, and display query results based on the button pressed.

At this time I want to display query results.

I have figured out how to use jquery to display the results of a query in a div at the bottom of my form. what I need help with is how if display the results in given location of the form.

Here is a real simple example of what I want:

HTML

<html>  
< head>  
< title>JQuery test< /title>  
< /head>  
< body>  
< form>  
< table>  
< tr>< th>Equipment ID< /th>  
< td>< input type="text name="eqid" id="eqid" />< /td>  
< th>Manufacturer< /th>  
< td>< input type="text name="manuf" id="manuf" />< /td>  
< th>Model< /th>  
< td>< input type="text name="model" id="model" />< /td>< tr>  
< /table>  
< div id=output> < /div>  
< /form>  
< /body>  
< /html>

JQUERY

$("#submit_btn").click(function()  
{  
  var data = $('form:first').serialize();  
   $.ajax(  
   {  
    url:"passdata.php",   
    type: "POST",  
    data:data,  
    success:function(data)  
    {  
       $("#output").html(data);  
    } //end success  
   }); // end ajax  
});  // end click

This what I’m using on my php file

PHP

<?php
    $eqid = $_POST['eqid'];  
    $manuf = 'Apple';  
    $model ='IPAD 2';  

    echo "<table border=0><tr>";
    echo "<th align ='left'>Manufacturer</th><td><input name='manuf' id='manuf' type='text' size='10' value=" . $manuf . "></td></tr>";  
    echo "<tr><th align ='left'>Surveyed by</th><td><input name='model' id='model' type='text' value=". $model . "></td></tr></total>";  
?php>

I would like the results of the query (manufacture and model) to be displayed in the appropriate location of the form in the example above.

Any suggestion would be greatly appreciated.

Chris

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    passdata.php needs to do your database querying then return the data. JSON is a nice way of doing this.

    <?php
$iteminfo = array('id' => $id, 'manuf' => $manuf, 'model' => $model);

echo json_encode($iteminfo);
?>

    your ajax call then needs to take this data and populate your form.

    $("#submit_btn").click(function()  
{  
  var data = $('form:first').serialize();  
   $.ajax(  
   {  
    url:"passdata.php",   
    type: "POST", 
    dataType: 'json', 
    data:data, 
    success:function(data)  
    {  
       $("eqid").val(data.id); 
       $("manuf").val(data.manuf);
       $("model").val(data.model);      
    } //end success  
   }); // end ajax  
});  // end click

    Of course if you’re using the same form for all CRUD operations, your php is going to have to be just as sneaky as your javascript. You sure this is a good idea for you?

    • 0