Автозаполнение для текстового поля в HTML-таблицу
У меня есть Html-таблица, имеющая несколько строк с одним раскрывающимся списком и одним элементом управления textbox.
Мне нужна функция автозаполнения для этого текстового поля.Я реализовал следующий код для автозаполнения, но он срабатывает только для первой строки.Строки добавляются динамически (в jquery), это не работает для этих строк.
Что я уже пробовал:
Code: <table class="table table-bordered table-hover datatable-highlight" id="tWDE_Items"> <thead> <tr> <th style="display:none">ItemId</th> <th>Item Name</th> <th>UOM</th> </tr> </thead> <tbody> @foreach (var Item in Model.Data_Wde_ItemGrid) { <tr class="datarow"> <td style="display:none">@Item.Item_Id</td> <td>@Html.EditorFor(m => Item.Item_Name, new { htmlAttributes = new { @class = "form-control" } }) </td> <td>@Html.DropDownListFor(m => Item.UOM_Id, new SelectList(Item.UOMDetails, "UomId", "UomName"), htmlAttributes: new { @class = "form-control", id = "UomId" })</td> </tr> } </tbody> </table> Jquery : <pre> $('#Item_Item_Name').autocomplete({ source: function (request, response) { debugger; var param = { ItemName: $('#Item_Item_Name').val() }; $.ajax({ url: "/WDE/GetAutoCompleteItemList", data: JSON.stringify(param), dataType: "json", type: "POST", contentType: "application/json; charset=utf-8", success: function (data) { response($.map(data, function (item) { return { val: item.split('÷')[0], label: item.split('÷')[1] } })) }, error: function (response) { alert(response.responseText); }, failure: function (response) { alert(response.responseText); } }); }, change: function (e, i) { if (i.item) { } else { $('#Item_Item_Name').val(''); $('#Item_Item_Id').val(''); } }, select: function (e, i) { debugger; $('#Item_Item_Name').val(i.item.label); $(this).closest("tr").find("td").eq(2).html(i.item.val); }, minLength: 1 });