jquery 自动完成 MVC3

Question

我已经获得了几乎完整的功能，正在寻求一些帮助。我有一个带有 VendorID 属性的模型。我有一个使用这个模型的强类型 View 。我允许用户从使用自动完成的输入文本框中选择供应商。

我使用此 razor 语法将模型的 VendorID 属性绑定(bind)到 View 上的隐藏字段。

@Html.HiddenFor(m => m.VendorID)

当用户在文本框中输入几个字符并选择一个项目时，我拥有的 jquery 函数会设置隐藏字段的值。到目前为止，一切都很顺利。我遇到的问题是，如果用户完全清除文本框或输入无效文本，而没有选择有效值，并且我的隐藏字段无法更新。

这是我迄今为止拥有的 jquery。

$(document).ready(function () {
    $('#vendorautocomplete').val($('#VendorName').val());  //prepopulate our vendorautocomplete textbox from our model
});

$(function () {

    $('#vendorautocomplete').autocomplete({

        source: function (request, response) {
            $.ajax({
                url: "/test/vendors", type: "POST", dataType: "json", //Url to our action supplying a list of vendors
                data: { searchString: request.term, maxRecords: 10 }, 
                success: function (data) {
                    response($.map(data, function (item) {
                        return { label: item.VendorName, value: item.VendorName, id: item.VendorID };
                    }));
                }
            });
        },
        select: function (event, ui) {
            $('#VendorID').val(ui.item ? ui.item.id : 0); //Set our VendorID hidden for model binding
        }

    });
});

我希望我可以在自动完成功能中做一些类似于上面的 select: 的事情，仅用于模糊:，但这没有用。我想我可以使用模糊事件根据文本框中的值查找供应商的 ID，但似乎在某些时候我应该能够检测到无效的供应商名称并将隐藏字段设置为 0，我只是不知道在哪里。

Answer 1

通过将以下内容添加到我的脚本中，我成功地完成了我想做的事情。

对于错误的搜索数据(没有返回值)

success: function (data) {
                    var arr = $.map(data, function (item) { return { label: item.VendorName, value: item.VendorName, id: item.VendorID }; });
                    if (arr.length == 0) {
                        $('#VendorID').val(null);
                        $('#VendorName').val('');
                    }
                    response(arr);
                }

我检查更改事件中是否有空白文本框

  $(function () {
      $('#vendorautocomplete').change(function () {
          if ($('#vendorautocomplete').val() == null || $('#vendorautocomplete').val() === "") {
              $('#VendorID').val(null);
              $('#VendorName').val('');
          }
      });
  });

不确定这是最好的解决方案，但它有效，我需要解决其他问题。