Question

我使用这种方法（https://dotnetfiddle.net/UjxtUW）在MVC视图中创建动态表。

表格中的单元格具有文本框，并且通过jQuery UI对话框填充了一些文本框值。打开相应对话框的代码是，

$("#invItemsTable").on('click', 'td', function () {
   var cIndex = $(this).index();
   var $tr = $(this).closest('tr');
   rowIndex = $tr.index();
   if (cIndex == 7)
       $("#dlAccCode").dialog("open");
   else if (cIndex == 0)
       $("#mdGrnList").dialog("open");
   else if (cIndex == 5)
       $("#dlTaxCode").dialog("open");
});

当用户在对话框中选择一条记录时，该特定记录的CODE将被设置为表格单元格值，

$("#AccCodeTable").delegate("input[type='radio']", "change", function (){
    var $this = $(this);
    $('#invItemsTable [id$=txtAccCode]').slice(rowIndex).val($this.val());
    $('#dlAccCode').dialog("close");
 });

问题是如果表格中有5行，并且我是否更改了“代码”。第3条记录，然后第4条和第5条也更新了相同的值。

以下代码也无效。

$('#invItemsTable tr:eq(' + rowIndex + ') td:eq(5)').val($this.val());

如果有任何方法可以使用表的列索引和行索引设置文本框值，请提供建议。

感谢。

Answer 1

<!DOCTYPE html>
<html>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>


<script>
    $(document).ready(function () {

        $('td').click(function () {
            $('#txt').val($(this).text())
        });


        $('#btnset').click(function () {

            var rowIndex = 1;
            $('#invItemsTable tr:eq(' + rowIndex + ')').find('td:eq(5)').text($('#txt').val());
        });

    });



</script>



<body>
    <input type="button" id="btnset" value="SetContent"/>
    <input type="text" id="txt"/>
    <table style="width:50%" id="invItemsTable">
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
    <td>5</td>
    <td>6</td>
  </tr>
  <tr>
    <td>11</td>
    <td>22</td>
    <td>33</td>
    <td>44</td>
    <td>55</td>
    <td>66</td>
  </tr>
</table> 
 </body>
</html>

Answer 2

问题在于您的slice声明。 Slice有2个参数start和end，它们定义了您希望从数组中选择的项的第一个和最后一个索引。如果省略end，则slice将所有数组元素从start索引返回到数组的末尾。如果只需要一个元素，则需要定义end。

变化：

$('#invItemsTable [id$=txtAccCode]').slice(rowIndex).val($this.val());

要：

$('#invItemsTable [id$=txtAccCode]').slice(rowIndex, rowIndex + 1).val($this.val());

Answer 3

使用nth-child：

$('#invItemsTable tr:nth-child(' + rowIndex + ') td:nth-child(5)').val($this.val());

使用jQuery基于索引设置表格单元格值

3 个答案: