Есть ли способ заполнить другое текстовое поле при onchange?

Question

вот мой код. Я новичок в php. поэтому извините заранее. Я действительно хочу проверить свой вход в txtbarcode, и если он существует в моей базе данных, я хотел бы заполнить txtdescription, но я не знаю, как это сделать или это даже возможно?

 <?php 
      $barcode = $_POST['txtbarcode']; 
      $query = "SELECT * FROM product WHERE product_id = '$barcode'"; 
      $query_exe = mysql_query($query); 
      $chk_query = mysql_num_rows($query_exe); 

      if($chk_query > 0) 
      { 
      $row = mysql_fetch_assoc($query_exe); 

      ?> 
      <th class = "textbox"><input type = "text" name = "txtbarcode" value = "<?php echo $row['product_id']; ?>" style="width:80px"/></th> 
      <th class = "textbox"><input type = "text" name = "txtdescription" value = "<?php echo $row['product_name']; ?>" style="width:100px"/></th> 
      <?php 
      } 
      ?> 

Answer 1

Вы можете сделать это, используя JQuery Ajax. Просто используя прослушиватель изменений в поле штрих-кода, он отправит ajax-вызов файлу check_barcode, который будет запрашивать таблицу и эхо-данные, которые вы хотите. Результат будет помещен в другое текстовое поле через JavaScript :).

Ниже приведен отдельный файл PHP.

<?php 
//----------------------------------- 
//check_barcode.php file 
//----------------------------------- 

if (isset($_POST['barcode'])) { 
    $query = mysql_query("SELECT * FROM product WHERE barcode = '".$_POST['barcode']."'"); 
    $num_rows = mysql_num_rows($query); 
    if ($num_rows > 0) { 
     $row = mysql_fetch_assoc($query); 
     echo $row['product_name']; 
    } 
} 
?> 

Ниже приведен код HTML и код JavaScript.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 

<script> 
    $(document).ready(function() { 
     $('#txtbarcode').change(function() { 
      var barcode = $(this).val(); 
      $.ajax({ 
       url: 'check_barcode.php', 
       type: 'POST', 
       data: {barcode: barcode}, 
       success: function(result) { 
        $('#txtdescription').val(result); 
       } 
      }); 
     }); 
    }); 
</script> 

<input type="text" name="txtbarcode" id="txtbarcode" /> 
<input type="text" name="txtdescription" id="txtdescription" /> 

---

UPDATE: Возвращение большего количества данных, и заполнение дополнительных полей.

Вам понадобится эхо-массив json из скрипта php, который содержит оба значения.

Например:

echo json_encode(array('product_name' => $row['product_name'], 'unit_measure' => $row['product_name'])); 

, а затем в JavaScript

<script> 
$.ajax({ 
    url: 'check_barcode.php', 
    type: 'POST', 
    data: {barcode: barcode}, 
    dataType: 'json', 
    success: function(result) { 
     $('#txtdescription').val(result.product_name); 
     $('#unitofmeasure').val(result.unit_measure); 
    } 
}); 
</script>