2015-06-27 235 views
0

我使用此插件 http://plugins.upbootstrap.com/bootstrap-ajax-typeahead/ 在網頁上具有預先輸入功能。javascript中的範圍變量

我必須輸入文本框。

一個用於品牌卡,另一個用於模型車。

I型時,它會顯示我的豐田

當選擇豐田,我希望看到的回聲,矩陣....

,所以我設置一個變量brandId獲得選擇的值,但在ULR返回的值是

http://localhost:8080/brands/undefined/models?query=ech

,但我在手錶exression brandId = 1示出了URL之前。

$(document).ready(function() { 
    var brandId; 

    $("#brand").typeahead({ 
     onSelect: function(item) { 
      debugger; 
      console.log(item); 
      //enable component 
      $("#model").removeAttr("disabled"); 
      brandId = item.value; 

     }, 
     ajax: { 
      url: 'http://localhost:8080/brands', 
      valueField: "brandId", 
      displayField: "brand" 
     } 
    }); 

    $("#model").typeahead({ 
     ajax: { 
      url: '/brands/' + brandId + '/models', 
      valueField: "modelId", 
      displayField: "model" 
     } 
    }); 
} 
+0

不應該'valueField:「brandId」,'是'valueField: brandId,'?你也可以刪除'var brandId;'這一行,如果你在一個函數中分配了一個未知的變量,它就會自動成爲一個全局變量。 – cari

+0

試圖更改valueField值,但得到相同的結果。我得到的brandId沒有在url屬性中定義 –

+0

@cari依賴全局變量是一種糟糕的做法,而且很糟糕的做法是在未警告將來的用戶或代碼維護人員的情況下這樣做。最好將它們明確地聲明爲全局變量(並將它們評論如此)。如果不這樣做,保持模塊範圍的對象會更好。 – Palpatim

回答

1

問題是,您正在使用一次構成的URL實例化#model typeahead。一旦url被分配到'/brands/' + <current value of brand ID> + '/models',您將永遠不會重新分配它。

嘗試重構您的預輸入分配到一個單獨的功能,你可以用brandId新值,當用戶選擇它撥打:

$(document).ready(function() { 
    var initModelTypeahead = function(brandId) { 
     $("#model").typeahead({ 
      ajax: { 
       url: '/brands/' + brandId + '/models', 
       valueField: "modelId", 
       displayField: "model" 
      } 
     }); 
    }; 

    $("#brand").typeahead({ 
     onSelect: function(item) { 
      debugger; 
      console.log(item); 
      //enable component 
      $("#model").removeAttr("disabled"); 
      initModelTypeahead(item.value); 
     }, 
     ajax: { 
      url: 'http://localhost:8080/brands', 
      valueField: "brandId", 
      displayField: "brand" 
     } 
    }); 

}); 
+0

嘗試,但阿賈克斯呼籲模型永遠不會完成 –

+0

嘗試更改您的'#品牌'AJAX URL到'/品牌'而不是指定主機。您可能會違反相同的原產地政策。 – Palpatim

+0

,不修復模型ajax調用...從來沒有完成,但品牌的一個確定 –