JQuery UI自动完成更改事件 - 重置选择ID

Question

我正在使用表单的AutoComplete UI小部件来允许用户键入客户名称.我们的想法是,他们可以选择现有客户并填充表单中的其他字段,也可以自由键入要创建的新客户.当用户选择现有客户时,我使用该select事件填充隐藏输入以存储与该客户​​关联的ID.

我遇到的问题是,如果用户首先从列表中选择一个客户,然后进入并编辑文本,实际上创建了一个新客户,我需要能够清除隐藏的输入ID值.

我提到了这个问题并创建了以下代码:

$(function() {
            $("#customerName").autocomplete({
                source: "/Customers/CustomerListJSON",
                minLength: 2,
                select: function(event, ui) {
                    $("#customerId").val(ui.item ? ui.item.Id : "");
                },
                change: function(event, ui) {
                    try {
                        $("#trace").append(document.createTextNode(event.originalEvent.type + ", "));
                        if (event.originalEvent.type != "menuselected")
                            $("#customerId").val("");
                    } catch (err) {
                        $("#customerId").val("");
                    }
                }
            });
        });

问题是更改事件被触发blur,因此如果用户选择了一个客户,则会填充隐藏的输入值,但只要他们将焦点从输入框移开,就会立即清除它.但是,如果我blur从event.originalEvent.type测试中排除事件,则隐藏字段的值永远不会在用户编辑先前选择的值的原始方案中重置.

有没有人必须先解决这个问题,如果是这样的话,你可以提供一些关于我如何管理隐藏输入值的指导,这样只有当从列表中选择一个项目并用任何其他值清除时才会填充它？

Answer 1

看起来我很快就解决了这个问题.参考JQuery UI wiki,事件中的ui项目与change事件中的项目相同select,因此我可以修改我的代码,如下所示:

$(function() {
    $("#customerName").autocomplete({
        source: "/Customers/CustomerListJSON",
        minLength: 2,
        select: function(event, ui) {
            $("#customerOrganizationId").val(ui.item ? ui.item.Id : "");
        },
        change: function(event, ui) {
            $("#customerOrganizationId").val(ui.item ? ui.item.Id : "");
        }
    });
});

没有必要测试事件,只是针对参数中是否有项目ui.select事件中的ID设置可能是多余的,但为了安全起见,我将保留两者.