Fill multiple fields from click with jquery mysql

Question

I do have a dynamic grid that shows items from MySQL table using PHP. I have a icon that is supposed to get data from MySQL based in the id of the current register and fill the fields in the form with related information:

PHP/HTML grid

$output .='<tr id="'.$id.'">';
$output .='<td>'.$description.'</td>';
$output .='<td>'.$description_pt.'</td>';
$output .='<td align="right">US$'.number_format($price, 2, '.', ',').'</td>';
$output .='<td align="center">'.$a_c.'</td>';
$output .='<td align="center">'.$note.'</td>';
$output .='<td align="center">'.$note_pt.'</td>';
$output .='<td align="center" class="icon_grid"><a class="editar" title="Open the register." href="#"><img src="images/Write2.gif" width="16" height="16" /></a></td>';
$output .='<td align="center" class="icon_grid"><a class="delete" title="Delete the register." href="#"><img src="images/Trash.gif" width="16" height="16" /></a></td>';
$output .='</tr>';

The HTML form:

<div id="edita_cadastro">
<form name="form3" id="form3" method="post" action="" >
  <table width="50%" border="0" cellspacing="2" cellpadding="0">
  <tr>
   <td colspan="2"><h3>Edit the current register</h3></td>
  </tr>
  <tr>
   <td align="right"><label for "edt_description"><img src="images/usa.jpg" width="18" height="15" />Description:</label></td>
   <td><input type="text" name="edt_description" id="edt_description" size="45" /></td>
  </tr>
  <tr>
   <td align="right"><label for "edt_description_pt"><img src="images/brazil.jpg" width="18" height="15" />Description:</label></td>
   <td><input type="text" name="edt_description_pt" id="edt_description_pt" size="45" /></td>
  </tr>
  <tr>
   <td align="right"><label for "edt_price">Price:</label></td>
   <td><input type="text" name="edt_price" id="edt_price" size="35" placeholder="ex.: 1.00" /></td>
  </tr>
  <input type="hidden" name="pack_id" id="pack_id" value="<?php echo $pack_id; ?>" />
   <td><input type="hidden" name="editar" value="editar" /></td>
   <td><input type="submit" name="submit" id="submit" value="Save" /></td>
  </tr>
  </table>
  </form>
</div>

Now, the PHP get_prices.php

include '../connect_to_mysql.php';

$item_id = $_POST['pk_id']; // Selected item Id

$query  = "SELECT * from packages_prices WHERE id='$item_id'";
$result = mysql_query($query);
$row = mysql_fetch_assoc($result, MYSQL_ASSOC);

$description = $row['description'];
$description_pt = $row['description_pt'];
$price = $row['edt_price'];

$arr = array( 'edt_description' => $description, 'edt_description_pt' => $description_pt, 'edt_price'=> $price);

echo json_encode( $arr );

Finally, the jQuery script:

$(document).ready(function(e) {
  $("#tabela tr[id]").on("click", ".editar", function () {  // Tabela is the table's id

    var obj = $(this).closest("tr[id]");

    $.ajax({
           type: "POST",
           url: 'get_prices.php',
           data: { pk_id: obj.attr("id")},
           dataType: "json",
           success: function(data, evt) {
           if (data.success == "true") {
               $("#edt_description").val(data.edt_description);
               $("#edt_description_pt").val(data.edt_description_pt);
         $("#edt_price").val(data.edt_price);

           } else {
               alert('error');
                  }
           }
   });

});

So, I don't know what may be wrong. The data is not coming and, of course, not filling the fields. Does anyone knows what is going on?

Thank you

Try $('table').on('click', 'tr td a.editar', function () in case if the table is static and the contents are dynamically inserted. — Omar
– Omar, Commented Sep 9, 2013 at 20:29
what errors are you getting? How far through the code have you gotten that you know works for sure? Have you done any debugging on the above code snippets? — amaster
– amaster, Commented Sep 9, 2013 at 20:29
It is not returning any error. It just open the form but with the fields empty. — Alex Araujo
– Alex Araujo, Commented Sep 9, 2013 at 20:42
Don't have an answer for you, but have some good advice. Firstly, try and stop using mysql_query() functions and start using PDO or MySQLi instead. These MySQL_* functions are now deprecated and are no longer supported. Also, you are sticking your $_POST variable directly into your SQL query without actually checking it's safe. Either use a function to check whether the variable is actually a real number, or use prepared statements. — TheCarver
– TheCarver, Commented Sep 9, 2013 at 20:49
Thanks for the tip. I just changed to MySQLi and verifying the POST. Still needing help for the query! — Alex Araujo
– Alex Araujo, Commented Sep 9, 2013 at 21:19

Charaf JRA · Accepted Answer · 2013-09-10 07:25:20Z

1

You have a syntax error , your forgot }); at the end of your script , so may it's the reason why it's not working:

<script>

    $(document).ready(function(e) {
  $("#tabela tr[id]").on("click", ".editar", function () {  // Tabela is the table's id

    var obj = $(this).closest("tr[id]");

    $.ajax({
           type: "POST",
           url: 'get_prices.php',
           data: { pk_id: obj.attr("id")},
           dataType: "json",
           success: function(data, evt) {
           if (data.success == "true") {
               $("#edt_description").val(data.edt_description);
               $("#edt_description_pt").val(data.edt_description_pt);
         $("#edt_price").val(data.edt_price);

           } else {
               alert('error');
                  }
           }
      });

     });

  }); 

</script>

edited Sep 10, 2013 at 7:25

answered Sep 9, 2013 at 22:56

Charaf JRA

8,3551 gold badge36 silver badges44 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Alex Araujo Over a year ago

Thanks @FaceOfJock! Even with the }) the problem was persisting until I found out that the error was in the PHP script. I was using SELECT * FROM.... this won't work in this case. We need to tell MySQL what field you want, so SELECT description, description_pt FROM... Thank you everyone for the tips and help!

Charaf JRA Over a year ago

@AlexAraujo ,without }); even if your correct php script , your will not get ajax response :) , by the way ,happy you find the solution :)

Collectives™ on Stack Overflow

Fill multiple fields from click with jquery mysql

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related