ASP.Net Core MVC 中的編輯方法為什么 javascript 中的“數據 ID”總是包含 1，如果我 select 項目 2 所以數據 ID 為 2

Question

(THIS IS JS)
$("#editBtn").click(function () {
    $.ajax({
        url: '/Products/Edit',
        data: {
            ID: $(this).attr('data-id')
        }
    })
        .done(function (response) {
            $("#actionContainer").html(response);
        })
        .fail(function (XMLHttpRequest, textStatus, errorThrown) {
            alert("Fail");
        });
});

(THIS HTML CODE)
<button type="button" id="editBtn" data-id="@item.ID">New</button>

'這是使用 ajax 在 asp.net 核心 mvc 中的編輯方法

Answer 1

我想要根據所選項目的“數據 ID”，如果我 select 項目 2 所以數據 ID 是 2'

如果您的按鈕在表格行中呈現，請將id屬性更改為class屬性（id 應該是唯一的），如下所示。

@foreach (var item in Model)
{
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.ID)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Name)
        </td>
        @*code of other fields*@
        <td>
            <button type="button" class="editBtn" data-id="@item.ID">New</button>
        </td>
    </tr>
}

使用 .class 選擇器$(".editBtn")修改您的代碼

$(".editBtn").click(function () {
    $.ajax({
        url: '/Products/Edit',
        data: {
            ID: $(this).attr('data-id')
        }
    })
        .done(function (response) {
            $("#actionContainer").html(response);
        })
        .fail(function (XMLHttpRequest, textStatus, errorThrown) {
            alert("Fail");
        });
});

此外，如果按鈕是視圖頁面中的單獨元素，您可能需要根據 select 更改事件等中的選定項動態更改data-id 。

$("#editBtn").attr("data-id", 2)