Question

我的网络表单模型（AdtFormModel）有这个变量：

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

我使用列表是因为我希望用户能够动态添加更多“TemoinsVille”＃39;在形式。现在我有两个textboxfor，当我填充它们时，我的控制器会收到一个包含2个项目的字符串列表。我将添加该功能以便以后动态添加TemoinsVille。

在我的表单中，我想为此TemoinVille变量使用自动完成字段。我使用了一种叫做“自动完成”的方法。这是有效的，我在表格的其他地方使用它。我不知道如何编写脚本，以便自动完成功能适用于第二个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

您的目标是#AdtFormModel_TemoinsVille，输入权是谁？该ID必须在页面上是唯一的。所以它只能在它找到的第一个输入上起作用。

您需要按类定位元素，然后自动完成应适用于所有输入。

尝试这样的事情：

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

jquery autocomplete - 字符串数组

1 个答案: