如何從我的jquery函式獲取表行中所選選項的值

我在資料表中使用選擇選項，我想從該表的行中獲取所選選項的值，當我想在表的每一行中獲取所選選項時，因為選擇“id”是一個，所以它帶來了每次都相同的值（第一個選定的值），但選定的選項值在每一行中都發生了變化。

HTML CODE:
  <div class="card-body">
            <table id="customerTable" class="data-table-customer table table-hover">
                <thead>
                    <tr>
                        <th>Name</th>
                        <th>Surname</th>
                        <th>Tel</th>
                        <th>Agent</th>

                    </tr>
                </thead>
                <tbody>


                    @foreach (var customer in Model.customerLoadList)
                    {
                    <tr id="customerRow">
                        <td>@customer.Name</td>
                        <td>@customer.Surname</td>
                        <td>@customer.PhoneNumber</td>
                       
                       <td class="agentList">
                       <div class="form-group">
  // id="agentList" this id is same for all values, how i change it to dynamic id
                        <select id="agentList" name="agentList" class="agentSelect form-control">
                         @foreach (var agent in Model.agentList)
                         {
                          <option value="@agent.AgentId">@agent.AgentNameSurname</option>
                          }
                        </select>
                        </div>
                       </td>
                      
                </tr>}

            </table>
        </div>

查詢代碼

function SaveCustomer() {
    var customerListForAdd = new Array();
    var table = document.getElementById("customerTable");
    var tableLenght = table.rows.length;
    for (var i = 0; i < tableLenght - 1; i  ) {
       
        var customerObj = {
            Name: ($('.data-table-customer').DataTable().cell(i, 0).data()).toString(),
            Surname: ($('.data-table-customer').DataTable().cell(i, 1).data()).toString(),
            PhoneNumber: ($('.data-table-customer').DataTable().cell(i, 2).data()).toString(),
// i get value from this code but all of the value are same i wanna make it dynamic
            Agent: $('select[name=agentList]').filter(':selected').val() 
            
        };
        customerListForAdd.push(customerObj);
    }

    $.ajax({
        type: 'POST',
        url: '/Stock/SaveCustomerList',
        data: { "customerListForAdd": customerListForAdd }, 
        ContentType: 'application/json; charset=utf-8',
        dataType: 'json',
        success: function (r) {
            alert(r   " record(s) inserted.");
        }
    });

}

uj5u.com熱心網友回復：

<select>每次達到值時都需要更改idoption

視圖

<div class="card-body">
            <table id="customerTable" class="data-table-customer table table-hover">
                <thead>
                    <tr>
                        <th>Name</th>
                        <th>Surname</th>
                        <th>Tel</th>
                        <th>Agent</th>

                    </tr>
                </thead>
                <tbody>
                    @*change here*@
                    @{int i = 0;}
                    @foreach (var customer in ViewBag.A)
                    {
                        <tr id="customerRow">
                            <td>@customer.Name</td>
                            <td>@customer.Surname</td>
                            <td>@customer.PhoneNumber</td>
                            <td class="agentList">
                           <div class="form-group">
      
                            <select id="agentList_@i" name="agentListName" class="agentSelect form-control">
                             @foreach (var agent in ViewBag.B)
                             {
                              <option value="@agent.AgentId">@agent.AgentNameSurname</option>
                              }
                            </select>
                            </div>
                           </td>
                </tr>
                i  ;
            }
               </tbody>
               
            </table>
            <button onclick="SaveCustomer()">Save</button>
</div>

腳本

<script>
function SaveCustomer() 
        {
       
        var customerListForAdd = new Array();
        var table = document.getElementById("customerTable");
        var tableLenght = table.rows.length;
        var rows = table.rows;
          for (var i = 0; i < tableLenght - 1; i  ) {
       
            var customerObj = {
                Name: ($('.data-table-customer').DataTable().cell(i, 0).data()).toString(),
                Surname: ($('.data-table-customer').DataTable().cell(i, 1).data()).toString(),
                PhoneNumber: ($('.data-table-customer').DataTable().cell(i, 2).data()).toString(),
    // i get value from this code but all of the value are same i wanna make it dynamic
                AgentId: $('#agentList_' i).val() 
            
            };
            customerListForAdd.push(customerObj);
        }



            $.ajax({
                type: 'POST',
                url: '/Home/test2',
                data:  JSON.stringify(customerListForAdd), 
                contentType: 'application/json;charset=utf-8',             
                success: function (data) {
                    alert(data);
                }
            });
    </script>

然后，您可以從 Jquery 函式中獲取值

標籤：html 查询 阿贾克斯 asp.net-core-mvc

上一篇：在for回圈中使用innerText編輯文本會凍結瀏覽器

下一篇：NestJS：無法在console.log中獲取嵌套物件。錯誤：屬性x在型別Dto上不存在