jQuery自動完成-字符串數組

Question

我的網絡表單模型（AdtFormModel）具有以下變量：

public List<String> TemoinsVille { get; set; }

我使用列表是因為我希望用戶能夠在表單中動態添加更多的“ TemoinsVille”。 現在我有兩個文本框，當我填滿兩個文本框時，我的控制器會收到一個包含2個項目的字符串列表。 我將添加功能以在以后動態添加TemoinsVille。

在我的表單中，我想為該TemoinVille變量使用一個自動完成字段。 我使用一種稱為“ AutocompleteTous”的方法，該方法有效，我在表單的其他地方使用它。 我不知道如何編寫腳本，以便自動完成功能可用於第二個TemoinVille輸入。

我的JQuery代碼是：

   var auto5 = $('#AdtFormModel_TemoinsVille').autocomplete({
        source: '@Url.Action("AutocompleteTous", "InvForm")',
        minLength: 3,
        delay: 400
    }).data("ui-autocomplete");
    auto5._renderItem = function (ul, item) {
        return $("<li>")
            .attr("ui-autocomplete-item", item)
            .append(item.label.split("|")[0])
            .appendTo(ul);
    };
    auto5._renderMenu = function (ul, items) {
        var that = this;
        $.each(items, function (index, item) {
            that._renderItemData(ul, item);
        });
        $(ul).addClass("dropdown-menu");
    };

在我看來，我沒有TemoinVille文本框用於輸入：

@Html.TextBoxFor(x => x.AdtFormModel.TemoinsVille, new { Class = "form-control" }) @Html.ValidationMessageFor(x => x.AdtFormModel.TemoinsVille, null, new { @class = "text-danger" })

@Html.TextBoxFor(x => x.AdtFormModel.TemoinsVille, new { Class = "form-control" }) @Html.ValidationMessageFor(x => x.AdtFormModel.TemoinsVille, null, new { @class = "text-danger" })

自動完成功能適用於第一個輸入，但不適用於第二個輸入...

這是兩個輸入的html代碼：

<div class="invalidite-section">
        <input Class="form-control" id="AdtFormModel_TemoinsVille" name="AdtFormModel.TemoinsVille" type="text" value="" /> <span class="field-validation-valid text-danger" data-valmsg-for="AdtFormModel.TemoinsVille" data-valmsg-replace="true"></span>
    </div>

<div class="invalidite-section">
        <input Class="form-control" id="AdtFormModel_TemoinsVille" name="AdtFormModel.TemoinsVille" type="text" value="" /> <span class="field-validation-valid text-danger" data-valmsg-for="AdtFormModel.TemoinsVille" data-valmsg-replace="true"></span>
    </div>

有什么建議么？

Answer 1

您要定位ID #AdtFormModel_TemoinsVille ，這是輸入權嗎？ 該ID在頁面上必須唯一。 因此，它將僅在找到的第一個輸入上起作用。

您需要按類別定位元素，然后自動完成應該在所有輸入中起作用。

嘗試這樣的事情：

   var auto5 = $('.form-control input').autocomplete({ // I suppose .form-control is a div that contains the input