自動填充文本字段取決於Grails中的選定項目

Question

我在我的OrderItem域中有一個文本字段價格。

價格應自動改變/自動填充這取決於選中的產品

我怎麼去這個使用jQuery？到目前爲止，我所做的是

<script type="text/javascript"> 
     function loadProduct(id) { 
      $.ajax({ 
       type: "POST", 
       url: "${resource(dir:'product/get')}/" + id, 
       data: "{}", 
       contentType: "application/json; charset=utf-8", 
       dataType: "json", 
       async: true, 
       cache: false, 
       success: function (result) { 
        var div = $('#posthere')[0]; 
        if (result.error) 
         alert(result.error.message); 
        else { 
         $('#price')[0].value = result.product.price; 
         compute(); 
        } 
        //$('#dialog').dialog('open'); 
       }, 
       error: function (XMLHttpRequest, textStatus, errorThrown) { 
        var div = $('#posthere')[0]; 
        div.innerHTML = textStatus + " " + errorThrown; 
        $('#dialog').dialog('open'); 
       } 
      }); 
     } 
     function compute(){ 
      var price = parseFloat($('#price')[0].value); 
      var quantity = parseInt($('#quantity')[0].value); 
      $('#totalAmount')[0].value = price * quantity 
     } 
     $(function(){ // on load 
      var price = $('#price'); 
      price.on('change', function() { 
       compute(); 
      }); 
      $('#quantity').on('change', function() { 
       compute(); 
      }); 
      $('#product').on('change', function() { 
       loadProduct($('#product')[0].value); 
      }); 
      if (price[0].value == '') 
       loadProduct($('#price')[0].value); 
      else 
       compute(); 
     }); 
    </script> 

我不知道如果我有上面的錯誤，請幫我解決嗎？計算功能工作正常，但每當我選擇一個產品的價格字段沒有發生變化

OrderItem的域名：

int orderNumber 
int quantity = 1 
Customer customers 
Product product 
BigDecimal price 
BigDecimal totalAmount = 0 

static constraints = { 
    orderNumber min:1, blank: false 
    quantity   min: 1, blank: false 
    price  min: 1.00, scale: 2, maxSize: 19 , blank: false 
    customers() 
    product() 
    totalAmount min:0.00, blank: false 
} 

static mapping = { 
    totalAmount formula: 'QUANTITY * PRICE' 
} 
String toString() { 
    return orderNumber 
} 

產品領域：

static hasMany = [orderitem: OrderItem] 
String productCode 
String productName 
int quantityInStock 
BigDecimal price 
static constraints = { 
    productCode blank: false, unique: true 
    productName blank: false 
    quantityInStock blank: false, min: 1 
    price blank: false, min: 0.01 
} 
public String toString(){ 
    return productName 
} 

我在這裏失去了一些東西？任何幫助將不勝感激。謝謝

 OST http://localhost:9001/static/product/get/ 405 (Method Not Allowed) 
send @ jquery-2.1.3.js?compile=false:8625 
ajax @ jquery-2.1.3.js?compile=false:8161 
loadProduct @ create:43 
(anonymous function) @ create:94 
i @ jquery-2.2.0.min.js?compile=false:2 
fireWith @ jquery-2.2.0.min.js?compile=false:2 
ready @ jquery-2.2.0.min.js?compile=false:2 
J @ jquery-2.2.0.min.js?compile=false:2 
    create:72 
Uncaught TypeError: Cannot set property 'innerHTML' of undefined 
error @ create:72 
fire @ jquery-2.1.3.js?compile=false:3094 
fireWith @ jquery-2.1.3.js?compile=false:3206 
done @ jquery-2.1.3.js?compile=false:8261 
(anonymous function) @ jquery-2.1.3.js?compile=false:8600 

上面的代碼是在谷歌開發者工具的輸出控制檯錯誤

Answer 1

這一點看起來不對，你還沒有把圍繞它

if (result.error) 
         alert(result.error.message); 
        else { 
         $('#price')[0].value = result.product.price; 
         compute(); 
        } 


if (result.error) { 
         alert(result.error.message); 
        } else { 
          console.log('---we have '+result.product.price); 
         $('#price')[0].value = result.product.price; 
         compute(); 
        } 

您的開發者控制檯足夠的括號您瀏覽器（Chrome）是你最好的朋友 - 這一點應該拋出一些形式的Java腳本錯誤

我已經添加了一個console.log應該顯示，如果你前夕n使用更新後的代碼