Question

我正在使用标准的自动填充插件here。

我的表单上有两个文本框，项目名称和项目ID。我的想法是，我希望用户按名称搜索项目，但在表单提交中我实际上需要项目ID。

我从自动完成中使用的ASP.NET MVC操作返回json。

用户开始键入项目名称，将显示自动完成列表，并将其格式化为显示json对象中的项目名称。然后，用户可以单击列表中的名称，并且项目ID将填充在另一个文本框中（一旦一切正常，实际上将是隐藏字段）。然后我可以在提交表单之前检查第二个文本框中是否有值。

在上面的场景中，一切都很好。但到目前为止我有两个巨大的错误：

1）用户必须实际点击列表中要激活result功能的项目。因此，如果项目 apples ，并且用户只是直接在文本框中键入 apples ，则不会填充项ID。

2）用户可以从列表中选择 apples ，这会填充项目ID。然后用户改变主意并返回文本框并键入 oranges 。同样，如果他实际上没有点击列表中的项目，则项目ID不会更改，现在提交表单时会提交错误的项目ID。如果用户键入的内容不是有效选项，例如他将文本框更改为 applesblahblahblah ，则 apples 的项目ID仍将提交虽然没有做出有效的项目选择。

我已经看过一些示例，表明可以通过触发search事件来解决这个问题，但我已经尝试过了，但它似乎没有做太多。

有谁知道如何解决这个问题？

到目前为止，我的代码如下所示，目前它的标准非常标准......

$('#ItemSearch').autocomplete("MyAction/FindItems", {
    dataType: 'json',
    parse: function(data) {
        var parsed = [];
        for (var i = 0; i < data.length; i++) {
            parsed[parsed.length] = {
                data: data[i],
                value: data[i].Value,
                result: data[i].Key
            };
        }
        return parsed;
    },
    formatItem: function(row) {
        return row.Value;
    }
}).result(function(event, data, formatted) {
    $(this).val(data.Value);
    $('#ItemId').val(data.Key);
}).blur(function() {
    // this is where I was trying to force an update of the item id textbox, 
    // but it doesn't work.
    $(this).search();
});

我会很高兴任何指针。感谢

编辑：如果有一个更好的自动完成处理json和强制验证，我会很高兴听到建议，因为它可能比试图使这个更容易。

Answer 1

更好的自动完成可能是the jQuery UI autocomplete，这确实需要jQuery UI（相当大的库），但更灵活。它有很多可用于强制验证的事件。

使用jQuery自动完成插件验证输入

1 个答案: