使用先前文本字段的信息自动填充文本字段

Question

I have a form, which I'm using autofill using jquery in the first textfield. This textfield is called "producto1".

What I want is that when user write the information in "producto1" automatically load the content in "marca1", the content in this field will be loaded from my database.

This is my code:

<table width="100%" border="0" align="center" cellpadding="5" cellspacing="0">
            <tr>
              <td width="545"><div align="center">
                <input name="producto1" type="text" class="textfield4" id="producto1" value="" size="65" />
              </div></td>
              <td width="385"><div align="center">
                <input name="marca1" type="text" class="textfield5" id="marca1" size="10" maxlength="5" onKeyPress="return handleEnter(event);">
              </div></td>
              <td width="385"><input name="cantidad1" type="text" class="textfield5" id="textfield2" size="10" maxlength="5" onKeyPress="return handleEnter(event);"></td>
            </tr>
</table>

The information that will be displayed at the "marca1" field will be loaded from my database, but my problem is that I don't know how to populate automatically this second field using ajax.

Answer 1

// JS File
$(document).ready(function(){
   $("#producto1").keyup(function(){
       $.post('/path-to/marca.php', 
              {
                 text: $(this).val()
              },
              function(data) {
                  $('#marca1').val(data.returns);
              }, 
              'json');
   });
});

// PHP File

$sql = $mysqli->query("SELECT marca_name 
                      FROM marca 
                      WHERE marca_name 
                      LIKE '%" . $mysql->real_escape_string($_POST['text']) . "%'");
while($row = $sql->fetch_assoc($sql))
   $returns[] = $row['marca_name'];

echo json_encode("returns" => implode(",", $returns));