1

我想要两个不同的自动完成框，但都在后台使用相同的 AJAX 方法。这是我的脚本

$(document).ready(function () {
    $("#SearchProject")
        .each(function () {
            var urlloc = "/Project/FindProjects";
            $(this).autocomplete({
                source: function (request, response) {
                    $.ajax({
                        url: urlloc, type: "POST", dataType: "json",
                        data: { searchString: request.term, maxResults: 10 },
                        success: function (data) {
                            response($.map(data, function (item) {
                                return { label: item.name, value: item.name, id: item.id }
                            }))
                        }
                    })
                },
                select: function (event, ui) {
                    $("[id$='ProjectID']").val(ui.item.id);
//                    alert(ui.item ? ("You picked '" + ui.item.label + "' with an ID of " + ui.item.id)
//                    : "Nothing selected, input was " + this.value);

                }
            });
        });
    });

我希望表单上的输入字段如下所示。

 <input id="SearchProject" name="SearchProject" type="text" value="" /><input  type="hidden" name="ProjectID" id="ProjectID" value="" />

    <input id="SearchProject2" name="SearchProject" type="text" value="" /><input type="hidden" name="ProjectID" id="ProjectID2" value="" />

自动完成选择完成后，我希望更新相应的隐藏字段。我如何实现这一目标？

4

1 回答 1

1

两种可能：

第一个（我更喜欢的那个）：将您的自动完成设置提取到一个方法中：

function configureAutocomplete(autoField, updatedField)

您可以根据需要为尽可能多的自动完成字段调用此方法，并将两个 JQuery 选择器传递给它：自动完成字段的选择器和隐藏的更新字段。

另一种方法是将隐藏字段的 ID 基于自动完成字段的 ID。这将允许您使用 aneach将行为附加到字段，但我认为这比它的价值更麻烦。

于 2012-08-27T16:29:07.067 回答