2015-06-27 155 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调用...从来没有完成,但品牌的一个确定 –