Json响应未显示文本框中的值

Question

我正在尝试根据在 Food item texbox 中选择的 Food item 从 mysql 数据库中获取值，并将其显示在 Unit price 文本框中。我使用了 Food item 文本框上的 blur 事件来调用 getJSON 方法并从数据库中获取值。 我可以在 Firebug 中看到从 getJSON 返回的响应，但响应未显示在文本框中。代码写在下面

<div class='col-sm-3'>    
  <div class='form-group'>
    <label>Food Item</label>
      <input class="form-control" id="item_name" name="itemname" autocomplete="off" size="30" type="text" required="true"/>
   </div>
</div>
<div class="col-md-1"></div>
<div class='col-sm-1'>    
   <div class='form-group'>
     <label>Quantity</label>
     <input class="form-control" id="quantity" name="quantity" autocomplete="off"       type="number" min="1" max="100" required="true"/>
   </div>
</div>
<div class="col-md-1"></div>
 <div class='col-sm-1'>    
   <div class='form-group'>
     <label>Unit price </label>
     <input class="form-control" id="unit_price" name="unitfoodprice" type="number" />
   </div>
 </div> 

 <div class="col-md-1"></div>
   <div class='col-md-1'>
     <div class='form-group'>
      <br>
      <button type="button" id="additems" name="additems" class="btn btn-sm btn-primary">Add Items</button> 
     </div>
    </div>                                                      
  </div

我的 Jquery 代码是

//To get the food item price
     $(document).ready(function() {

         $('#item_name').blur(function() {

            if(  $("#item_name").val() !== "" )
         {
            //To pass the customer details and fetch related details
            $.getJSON("getfooditemprice.php", {fooditemname: $('#item_name').val()}, function(data){

                            if(data === "empty")
                           {
                              //$('#myModal').hide(); 
                              alert('No Price exists for the particular Food item');                        
                              $("#item_name").val('');
                              $("#item_name").focus();
                              return false;                         
                           }
                            var foodprice = data['price'];
                            $('#unit_price').val(foodprice );

                    });                   

         }

      });
});

我的php代码是

require 'core/init.php';

if (isset($_REQUEST['fooditemname'])) {

$query = $_REQUEST['fooditemname'];
    $sel_fooditemprice = "SELECT price FROM fooddetails WHERE itemname = '$query'";
    $stmt = $db->prepare($sel_fooditemprice);
    $stmt->execute();

    //this is how to get number of rows returned
    $num = $stmt->rowCount();
     if ($num) 
    {
        while ($row = $stmt->fetch(PDO::FETCH_ASSOC)) {
        $array[] = $row['price'];
        }
        echo json_encode ($array); //Return the JSON Array
    } 
    else 
   {
        $array[] = "No Price exists for this food item";
        echo json_encode($array);
   }
}  

Answer 1

var foodprice = data['price'];
$('#unit_price').val(foodprice );

data 是一个 JSON 对象，所以你需要解析它，然后将每个价格分配给一些 html 元素，例如：

$.getJSON("getfooditemprice.php", {fooditemname: $('#item_name').val()}, function(json){
    if(json.length == 0){ //check if is data returned
        //$('#myModal').hide();
        alert('No Price exists for the particular Food item');
        $("#item_name").val('');
        $("#item_name").focus();            
    }else{
        $.each(json, function(i, item) {
            price = item;
            //do sometinh with price
            //example
            alert(price);
        });​
    }
});    

然后编辑你的 php 脚本并更改：

$array[] = "No Price exists for this food item";

到这里：

$array[] = "";

这是因为 if(json.length == 0) 将始终为 false，因为该消息是一项。