Question

如何使用不包括标题行的jquery在MVC中循环遍历动态创建的表。

要求： - 我有两列的表＆＃34; id＆＃34;和＆＃34;命名＆＃34;通过单击新我可以添加新行和类型数据。点击提交时我需要检查所有行是否包含数据类型。如果所有内容都已填写，表单将提交其他提醒用户填写表单。

我面临的问题是它没有读取表格的texbox上输入的值。我尝试了.Text（）和.val（）

使用代码编辑

      <table id="Newservice" style="display:none">
        <tr>
 <td><input id="start-%" class="datepicker" style="width:75px" type="text" name="provider_service_dtls[#].activity_start_date" value /></td>
<td><input id="type-%" style="width:100px" class="act_type" type="text" name="provider_service_dtls[#].activity_type" readonly value /></td>
<td><input id="code-%" class="act_code" style="width:150px" type="text" name="provider_service_dtls[#].activity_code"  value /></td>
 <td><input id="clinician-%" class="clini" style="width:150px" type="text" name="provider_service_dtls[#].clinician" value /></td>
 <td><input id="net-%" class="" style="width:40px" type="text" name="provider_service_dtls[#].net_amt" value /></td>
 <td><input id="qty-%" class="" style="width:25px" type="text" name="provider_service_dtls[#].quantity" value />
<input type="hidden" name="provider_service_dtls.Index" value="%" />
 </td>
<td><input id="delete" class="delete" value="X" type="button"></td> </tr>
</table>

jquery添加代码

 var index = (new Date()).getTime();
var clone = $('#Newservice').clone();
clone.html($(clone).html().replace(/\[#\]/g, '[' + index + ']'));
clone.html($(clone).html().replace(/"%"/g, '"' + index + '"'));
clone.html($(clone).html().replace(/"token-input-diag-%"/g, 'token-input-diag-' + index));
 clone.html($(clone).html().replace(/"token-input-desc-%"/g, 'token-input-desc-' + index));
clone.html($(clone).html().replace(/"type-%"/g, 'type-' + index));
clone.html($(clone).html().replace(/"code-%"/g, 'code-' + index));
                    clone.html($(clone).html().replace(/"start-%"/g, 'start-' + index));
clone.html($(clone).html().replace(/"clinician-%"/g, 'clinician-' + index));
clone.html($(clone).html().replace(/"net-%"/g, 'net-' + index));
clone.html($(clone).html().replace(/"qty-%"/g, 'qty-' + index));
var html = clone.html();
$("#service").append(clone.html());

循环阅读

var table = $("service");
  table.find('tr').each(function (i, el) {
 var $tds = $(this).find('td');
alert($tds.eq(1).text());
alert($tds.eq(2).text());
alert($tds.eq(3).text());
alert($tds.eq(4).text());
alert($tds.eq(5).text());
}

Answer 1

在循环加载，

你写 $（＆＃34; service＆＃34;）。它将是$("#service")或$(".service")

如您想要输入值，可以按$tds.eq(1).find('input').val()

找到

请看一下小提琴：https://jsfiddle.net/fbg0mu45/3/

＆＃13;

$("#btnAdd").click(function() {
    addTable();
});

$("#btnSubmit").click(function() {
    var table = $("#dvTable");
    table.find('tr').each(function(i, el){
    $(this).find('td').each(function(j,elem){
        alert($(this).find('input').val());
        //alert($(this).html());
        });
    });
  
});

var addTable = function () {
    var index = (new Date()).getTime();
    var clone = $('#Newservice').clone();
    clone.html($(clone).html().replace(/\[#\]/g, '[' + index + ']'));
    clone.html($(clone).html().replace(/"%"/g, '"' + index + '"'));
clone.html($(clone).html().replace(/"token-input-diag-%"/g, 'token-input-diag-' + index));
 clone.html($(clone).html().replace(/"token-input-desc-%"/g, 'token-input-desc-' + index));
clone.html($(clone).html().replace(/"type-%"/g, 'type-' + index));
clone.html($(clone).html().replace(/"code-%"/g, 'code-' + index));
                    clone.html($(clone).html().replace(/"start-%"/g, 'start-' + index));
clone.html($(clone).html().replace(/"clinician-%"/g, 'clinician-' + index));
clone.html($(clone).html().replace(/"net-%"/g, 'net-' + index));
clone.html($(clone).html().replace(/"qty-%"/g, 'qty-' + index));
var html = clone.html();
    $("#dvTable").append(html);
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="Newservice" style="display:none">
        <tr>
 <td><input id="start-%" class="datepicker" style="width:75px" type="text" name="provider_service_dtls[#].activity_start_date" value /></td>
<td><input id="type-%" style="width:100px" class="act_type" type="text" name="provider_service_dtls[#].activity_type" readonly value /></td>
<td><input id="code-%" class="act_code" style="width:150px" type="text" name="provider_service_dtls[#].activity_code"  value /></td>
 <td><input id="clinician-%" class="clini" style="width:150px" type="text" name="provider_service_dtls[#].clinician" value /></td>
 <td><input id="net-%" class="" style="width:40px" type="text" name="provider_service_dtls[#].net_amt" value /></td>
 <td><input id="qty-%" class="" style="width:25px" type="text" name="provider_service_dtls[#].quantity" value />
<input type="hidden" name="provider_service_dtls.Index" value="%" />
 </td>
<td><input id="delete" class="delete" value="X" type="button"></td> </tr>
</table>
    
    <input type='button' id='btnAdd' value='Add'/>
    
    <table id='dvTable'>
    </table>
    <input type='button' id='btnSubmit' value='Submit'/>

＆＃13;

使用jquery循环遍历html表

1 个答案: