jQueryUI 在多个字段上自动完成

发布于 2024-11-18 23:57:27 字数 835 浏览 3 评论 0原文

我正在使用 jQueryUI 1.8，它具有自动完成功能。

到目前为止，我已经成功地在多个字段中实现自动完成，如下所示：

$(function() {
    $("#auto").autocomplete({
        source: "/auto",
        minLength: 2,
        dataType: 'json',
        change: function( event, ui ) {
                $("#Id").val(ui.item ? ui.item.id : "");
                $("#Info").val(ui.item.info);
                $("#Info2").val(ui.item.info2);

        },
        select: function( event, ui ) {
                $("#Id").val(ui.item ? ui.item.id : "");
                $("#Info").val(ui.item.info);
                $("#Info2").val(ui.item.info2);
        }
    });
});

这个想法是在可用时使用隐藏 ID 保存表单，或者如果与数据库相比其中任何一个字段发生更改，则从字段 auto、info 和 info2 创建新记录。现在，如果我选择一条记录并修改自动字段，它就会像它应该的那样清除隐藏的 ID。但是，如果我选择一条记录并修改字段 info 或 info2，则所选的 id 保留在隐藏输入中，这是错误的。

解决这个问题的最佳方法是什么？

原文

I'm using jQueryUI 1.8 and it's autocomplete feature.

So far I have managed to get autocomplete working in multiple fields like this:

$(function() {
    $("#auto").autocomplete({
        source: "/auto",
        minLength: 2,
        dataType: 'json',
        change: function( event, ui ) {
                $("#Id").val(ui.item ? ui.item.id : "");
                $("#Info").val(ui.item.info);
                $("#Info2").val(ui.item.info2);

        },
        select: function( event, ui ) {
                $("#Id").val(ui.item ? ui.item.id : "");
                $("#Info").val(ui.item.info);
                $("#Info2").val(ui.item.info2);
        }
    });
});

The idea is to save form with hidden ID when available or create a new record from fields auto, info and info2 if any of them is changed compared to database. Now this is working if I pick a record and modify auto field it clears hidden id like it should. But if I pick a record and modify fields info or info2 the picked id stays in hidden input which is wrong.

What is best approach to solve this problem?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

半山落雨半山空 2024-11-25 23:57:27

您只想在#Info 或#Info2 更改时清除#Id 吗？您只需监听 keydown 或 change 事件即可做到这一点：

$("#Info, #Info2").keydown(function() {
    $("#Id").val('');
});

此外，您的更改函数会为我抛出一个错误，因为在 change 上, ui.item 并不总是被定义。以下是解决此问题的方法：

change: function(event, ui) {
    $("#Id").val(ui.item ? ui.item.id : "");
    if (ui.item) {
        $("#Info").val(ui.item.info);
        $("#Info2").val(ui.item.info2);
    }
},

我写了一个您想要执行的操作的示例： http://jsfiddle.net /dNdhk/。如果这不是您想要实现的目标，请告诉我。

Do you just want to clear #Id when #Info or #Info2 change? You could do that just by listening to the keydown or change event:

$("#Info, #Info2").keydown(function() {
    $("#Id").val('');
});

Also, your change function is throwing an error for me, since on change, ui.item is not always defined. Here's how you could fix that:

change: function(event, ui) {
    $("#Id").val(ui.item ? ui.item.id : "");
    if (ui.item) {
        $("#Info").val(ui.item.info);
        $("#Info2").val(ui.item.info2);
    }
},

I wrote up an example of what you're trying to do: http://jsfiddle.net/dNdhk/. Let me know if this isn't what you're trying to accomplish.

回复收藏 0 原文

~没有更多了~