Блог

Главная - Вопросы по программированию - Как получить значения текстового поля внутри таблицы

Как получить значения текстового поля внутри таблицы

#c# #jquery #html #twitter-bootstrap #html-table

#c# #jquery #HTML #twitter-bootstrap #html-таблица

Вопрос:

У меня есть таблица (с двумя текстовыми полями Item и Count) на моей веб-странице.

введите описание изображения здесь

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

Пожалуйста, посмотрите мой код ниже

  <table id="tbl-contents" class="table">
    <thead>
        <tr>
            <th>Item</th>
            <th>Count</th>
            <th></th>
        </tr>
    </thead>
    <tbody>
        <tr class="clsRow">
            <td>
                @*
                <input type="text" class="form-control" placeholder="Item" data-required="true">*@
                <input id="txtItem" class="form-control" placeholder="Item" type="text" value="" tabindex="-1" name="" data-required="true">
            </td>
            <td>
                @*
                <input type="text" class="form-control" placeholder="Item Count" data-required="true">*@
                <input id="txtItemCount" class="form-control" placeholder="Item Count" type="text" value="" tabindex="-1" name="" data-required="true">
            </td>
        </tr>
        <tr class="clsRow">
            <td>
                <input type="text" class="form-control" placeholder="Item">
            </td>
            <td>
                <input type="text" class="form-control" placeholder="Item Count">
            </td>
            <td>
                <a class="clsDelContent"><i class="fa fa-minus-square" style="font-size: 22px;"></i></a>
            </td>
        </tr>
        <tr class="clsRow">
            <td>
                <input type="text" class="form-control" placeholder="Item">
            </td>
            <td>
                <input type="text" class="form-control" placeholder="Item Count">
            </td>
            <td>
                <a class="clsDelContent"><i class="fa fa-minus-square" style="font-size: 22px;"></i></a>
            </td>
        </tr>
    </tbody>
    <tfoot>
        <tr>
            <td colspan="3" style="text-align: right;">
                <a class="clsAddContent"><i class="fa fa-plus-square" style="font-size: 22px;"></i></a>
            </td>
        </tr>
    </tfoot>
</table>

Скрипт

         $('#tbl-contents tbody tr').each(function () {
            var customerId = $(this).find("td").html();



            alert(customerId);
        });

Комментарии:

1. где твой скрипт ..? :

2. Спасибо за ваш ценный ответ. пожалуйста, посмотрите мой сценарий выше

Ответ №1:

 $('.clsRow').each(function() {
    var foo = $(this).find('input');
    var item = foo[0].value;
    var itemcount = foo[1].value;
})

JSFiddle

Ответ №2:

Вы могли бы попробовать:

 $('table  tbody tr td input').each(function(){
    console.log($(this).val())
});

ЖИВАЯ ДЕМОНСТРАЦИЯ

Ответ №3:

Вы можете использовать следующий скрипт.

 var reqValues = [];
$('.clsRow').each(function(i){
   var $currentTD = $(this).find('td')
   reqValues["item" i] = $currentTD.eq(0).find('input').val();
   reqValues["values" i] = $currentTD.eq(1).find('input').val();
 });

Чтобы получить определенное значение, используйте следующий код —

 reqValues["item1"]
reqValues["values1"]
reqValues["item2"]
reqValues["values2"]
Метки: