Как передать идентификатор в оператор Jquery - ASP. NET MVC

Question

Я пытаюсь передать EmployeeId строки, которую нажимаю, в оператор jQuery, но каждый раз получаю null. Буду признателен, если узнаю, что я делаю не так.

Оформите мой код ниже:

Index.cs html

@using (Html.BeginForm("Index", "Employee", FormMethod.Post, new { @id = "myForm" }))
{

    <table class="table">
        -- headers


        @foreach (var item in Model)
        {


            <tr>


                <td> <button class="btn btn-success" id="BtnId" onclick="Update(@item.EmployeeId)"><i class="fa fa-toggle-on"></i></button> </td>
                <td>
                    @Html.DisplayFor(modelItem => item.EmployeeId)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Name)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.DepartmentId)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Address)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.IsDeleted)
                </td>

            </tr>


        }
 </table>
}

    <script>
       $(document).ready(function () {
           var Update = function (EmployeeId) {



                $("#BtnId").on('click', function () {
                    var myformdata = $("#myForm").serialize();

                    $.ajax({
                        type: "POST",
                        url: "Employee/Index?EmployeeId="+EmployeeId,
                        data:myformdata,
                        success: function () {

                        }
                    });


                });
            }
        });
    </script>

Сотрудник Контроллер

public class EmployeeController : Controller
{
    EmployeeModule EM = new EmployeeModule();

    public ActionResult Index()
    {
        return View(EM.List());
    }


     [HttpPost]
    public ActionResult Index(int id)
    {



        bool a = EM.ExecuteSP(id);

        return View(EM.List());

    }

}

При наличии идентификатора метод ExecuteSP устанавливает для столбца IsDelete значение 2. Но, как я уже сказал, я просто получаю null ID каждый раз.

Answer 1

Атрибут ID на каждой странице должен быть уникальным, поэтому использование #BtnId неверно, поскольку ID повторяется. Добавьте BtnId к атрибуту класса и вместо него добавьте атрибут EmployeeId к data-id. См. Код ниже.

@foreach (var item in Model)
{
   <tr>
      <td>
         <button class="btn btn-success BtnId" data-id="@item.EmployeeId"><i class="fa fa-toggle-on"></i></button>
       </td>
       <td>
          @Html.DisplayFor(modelItem => item.IsDeleted)
       </td>
   </tr>
}

Тогда в вашем сценарии лучше связать событие с кнопкой; Используйте $(this).data("id") и присвойте его переменной EmployeeId, которую мы будем использовать в ajax.

 $(document).ready(function () {

   var EmployeeId = $(this).data("id");

   $(document).click(".BtnId",function(){
      $.ajax({
         type: "POST",
         url: "Employee/Index",
         data: {id: EmployeeId},
         success: function () {

         }
      });
   });

Answer 2

В контроллере вы ожидаете id имя, поэтому вам нужно переименовать из EmployeeId в id, как показано ниже.

 $(document).ready(function () {
           var Update = function (EmployeeId) {
                    $.ajax({
                        type: "POST",
                        url: "Employee/Index",
                        data: {id: EmployeeId},
                        success: function () {

                        }
                    });
            }
        });