javascript中的范围变量

时间:2015-06-27 23:47:31

标签: jquery json twitter-bootstrap-3 typeahead.js

我使用这个插件 http://plugins.upbootstrap.com/bootstrap-ajax-typeahead/ 在网页上拥有预先输入功能。

我必须发短信。

一个用于品牌卡,另一个用于模型车。

我输入To,它会显示我丰田

当选择丰田时,我希望看到回声,矩阵......

所以我设置了一个变量brandId来获取所选的值,但是在ulr中返回的值是

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

但是在显示网址之前,我会在手表外观中显示brandId = 1。

  $(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"
        }
    });
 }

1 个答案:

答案 0 :(得分:1)

问题是您使用一次组成的URL实例化#model预先输入。将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"
      }
  });

});