Question

Got a bit of a confusing situation, I have a form on my webpage that allows a user to enter information into a database…

Form

<form id="insertbill">
     Total <input type="text" id="total" name="total" /><br />
     Bill name<input type="text" id="bill-name" name="bill-name" /><br />
     bill descriptiion <input type="text" id="bill-description" name="bill-description" /><br />
     bill colour<input type="text" id="bill-colour" name="bill-colour" />
     <input type="button" value="submit" onClick="insertBill();" />
</form>  

This form then send the information via AJAX to my php which then inputs it into my DB

AJAX

function insertBill()
{
    $.post('insert_bill.php', $('#insertbill').serialize(), 
        function(data) {
        $('#bills').append(data);
    });
};

PHP

   $uid = $_SESSION['oauth_id'];       
   $bill = mysql_real_escape_string($_POST['total']);
   $billname = mysql_real_escape_string($_POST['bill-name']);
   $billdescription = mysql_real_escape_string($_POST['bill-description']);
   $billcolour  = mysql_real_escape_string($_POST['bill-colour']);

    #Insert Record
    $query = mysql_query("INSERT INTO `outgoings` (user_id, bill, bill_name, bill_description, bill_colour ) VALUES ('$uid', '$bill', '$billname', '$billdescription', '$billcolour')") or die(mysql_error());

Once this is done, the data is then returned to the webpage, with another form that allows the user to update the record…

Returned data/form

Print "<tr>"; 
Print "<th>total:</th> <td>".$bill . "</td> ";
Print "<th>bill name:</th> <td>".$$billname . "</td> ";
Print "<th>bill deposit:</th> <td>".$billdescription . "</td> "; 
Print "<th>colour:</th> <td>". $billcolour . " </td></tr>"; 
echo "<th>edit:</th> <td>

<form id='bill-upd'>
        <input type='hidden' value='". $billname."' name='billid' id='billid''>
        Total <input type='text' id='total' name='total' /><br />
        Bill name<input type='text' id='bill-name' name='bill-name' /><br />
        bill descriptiion <input type='text' id='bill-description' name='bill-description' /><br />
        bill colour<input type='text' id='bill-colour' name='bill-colour' />
        <input type='button' value='submit' onClick='updateBill();' />
    </form>   
</td>"; 

My problem is that the returned form doesn’t update, this is because I need to somehow find the id of the record that was inserted, place it into my form to be returned I think… I hope this isn’t too confusing, but has anybody a better way of doing this without reloading the page?

Answer 1

here’s what what you could include on your, insert_bill.php, view page:

<script> 
   var json=<? 
       $arr=array($bill, $billname, $billdescription, $billcolour);
       echo json_encode($arr); ?>;

     $('tr td:nth-child(0)').html(json[0]);
     $('tr td:nth-child(1)').html(json[1]);
     $('tr td:nth-child(2)').html(json[2]);
     $('tr td:nth-child(3)').html(json[3]);

</script>

I guess the one outstanding issue is the “id” you says gets returned from your database. Can you explain a little further? Are their multiple forms on your insert_bill.php page? Regardless, you could put that $id into the array and feed it into and html() function like I did with the other variables.