Установить значение ячейки таблицы на основе индекса с помощью jQuery

Я использовал этот подход (https://dotnetfiddle.net/UjxtUW) для создания динамической таблицы в представлении MVC.Установить значение ячейки таблицы на основе индекса с помощью jQuery

Клетки в таблице имеют текстовое поле, а некоторые значения текстовых полей заполняются через диалоговое окно интерфейса jQuery. Код, чтобы открыть соответствующее диалоговое окно,

$("#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"); 
});

Когда пользователь выбирает запись в диалоговом окне, код этой конкретной записи устанавливаются на значение ячейки таблицы с помощью,

$("#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());

Советуйте, если есть какой-либо способ установить значение текстового поля, используя индекс столбца и индекс строки таблицы.

Спасибо.

источник

2016-02-10 Saravanan Sachi

Проблема с вашим заявлением slice. Slice принимает 2 параметра, start и end, которые определяют первый и последний индексы элементов, которые вы хотите выбрать из массива. Если end опущено, срез вернет все элементы массива из индекса start в конец массива. Вы должны определить end, если вам нужен только один элемент.

Изменение:

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

To:

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

источник

2016-02-10 09:02:22 AlienHoboken

использование п-й ребенок:

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

источник

2016-02-10 09:04:35

Это немного кх udge. Это может сработать, но его код был близок и чище, он просто немного не хватало. Это вводит зависимости от его структуры HTML. – AlienHoboken

Это примерно пример его третьего кода. Я предложил «nth-child», потому что «eq» - индекс, основанный на 0, а «nth-child» начинается с 1. Может быть, ты прав, его просто что-то не хватает. –

Ах, не видел эту часть. Виноват! :) – AlienHoboken

<!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>

источник

2016-02-10 09:11:13 Aswathy

@ Saravanan Sachi plz проверить это – Aswathy

Установить значение ячейки таблицы на основе индекса с помощью jQuery

ответ

Смежные вопросы