用于 asp.net mvc Editorformany

问题描述

我有一个 Traveler 对象列表，我在 EditorForMany Html 工具的表格中列出了这些对象。这很好用。在这些表中的每一个中，我都有一个旅行者的姓名字段。我希望这个字段成为 EditorForMany 中每个 Traveler 表的自动完成。我已成功将自动完成添加到名称字段，但是自动完成仅适用于第一个 Traveler 表单。当我开始在下一个表格中输入时，我会得到一个空白字段列表。为什么第一个输入自动完成工作而其他人不工作？

局部视图中的输入：

@Html.EditorFor(model => model.TravelerId,new { htmlAttributes = new { @id = "travelerEdit",@class = "travelerEdit form-control",@travelFormId = Model.Id,Value = Model.TravelerName } })

使用 jQuery 的视图：

div id="travelFormTable" class="hidden">
    <div class="eventDivHeader"><h4>Travelers</h4></div>

    <div id="travelerList" class="form-group">
        @Html.EditorForMany(r => r.TravelForms,r => r.Id.ToString(),true)
    </div>
    <div id="roomButtonDiv" class="btn-group btn-group-lg">
        <button id="btnAddTraveler" class="btn btn-link">+ Add Traveler</button>
    </div>
    <div id="dialog-confirm" title="Delete this traveler?" style="display: none;">
        <p>
            You are about to permanently <b style="color: red;">delete</b> this <b>traveler</b> and all nested <b>information</b>. <br /><br />This action is immediate and cannot be undone.
            <br /><br />Are you sure you want to continue?
        </p>
    </div>
</div>
<script>
    $( function() {
        var people = JSON.parse('@Html.Raw(Json.Encode(ViewBag.AllPeople))');
        $(".travelerEdit").autocomplete({
            minLength: 0,autoFocus: true,classes: {
                "ui-autocomplete": "highlight"
            },source: function (request,response) {
                var matcher = new RegExp($.ui.autocomplete.escapeRegex(request.term),"i");
                var array = $.grep(people,function (value) {
                    return matcher.test(value.Label);
                });
                response(array);
            },focus: function (event,ui) {
                $(".js-selected-person").prop("innerText",ui.item.Label);
                return false;
            },select: function (event,ui) {
                var travelerId = ui.item.Value;
                var travelFormId = $(this).attr('travelFormId');
                SetTravelerName(travelerId,travelFormId);
                $("#travelerEdit").val(ui.item.Label);
                return false;
            },close: function (event,"");
                return false;
            }
            })
            .autocomplete( "instance" )._renderItem = function( ul,item ) {
                return $( "<li>" )
                    .append( "<div>" + item.Label + " | " + item.Description + "</div>" )
                    .appendTo( ul );
            };
    });
</script>

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

asp.net-mvc autocomplete jquery