从表中删除行后,动态id不起作用

Dynamic id does not work after removing row from table

本文关键字:动态 id 不起作用 删除行      更新时间:2023-09-26

我有一个表与feesettingid。它包含动态数据,我可以添加和删除删除行表。我动态生成的id工作良好,直到用户删除一行并再次添加新行,它覆盖最后一行的唯一id。我想表生成唯一的id与动态添加和删除功能。我的代码添加行如下。

<tablen id="feeSetting ">
<tbody>
</tbody>
</table>
<script>
     function AddRow() {
            debugger;
            var index = 0;
            if ($("#feeSetting tbody tr").length > 0) {
                  index = $("#feeSetting tbody tr").length;
            }
            $("#feeSetting tbody").append("<tr class='gradeX'>"
                + "<td class='col-md-3'><input type='text'  value='' class='form-control validate[required,custom[number]] text-input txtFromDay' id='eFromDay'/></td>"
                + "<td class='col-md-3'><input type='text' class='form-control validate[required,custom[number],min[1]] text-input txtValue' value='' id='eValue-" + index + "'/></td>"
                + "<td class='col-md-4'>"
                + "<div id='loadTypes-" + index + "'  class='typeValidation'></div></td>"
                + "<td class='col-md-2'><input type='button' class='btn btn-danger btn-sm' value='  Remove '/></td>"
                + "</tr>");
            renderPartialInDiv('@Url.Action("GetValidationTypeDropDown", "FeeFineSetting")?strDDName=eValidationTypeList-' + index + '&intDDID=0&intValidationID=1', '#loadTypes-' + index);
            $('#eValidationTypeList-'+index).select2();
        };
</script>

尝试使用一个全局变量,它将在每增加一行时增加其值,参见下面的代码

<tablen id="feeSetting ">
<tbody>
</tbody>
</table>
<script>
    //keep this variable outside function and use it as global variable.
     var index = 0;
     function AddRow() {
            debugger;
            index++;
            $("#feeSetting tbody").append("<tr class='gradeX'>"
                + "<td class='col-md-3'><input type='text'  value='' class='form-control validate[required,custom[number]] text-input txtFromDay' id='eFromDay'/></td>"
                + "<td class='col-md-3'><input type='text' class='form-control validate[required,custom[number],min[1]] text-input txtValue' value='' id='eValue-" + index + "'/></td>"
                + "<td class='col-md-4'>"
                + "<div id='loadTypes-" + index + "'  class='typeValidation'></div></td>"
                + "<td class='col-md-2'><input type='button' class='btn btn-danger btn-sm' value='  Remove '/></td>"
                + "</tr>");
            renderPartialInDiv('@Url.Action("GetValidationTypeDropDown", "FeeFineSetting")?strDDName=eValidationTypeList-' + index + '&intDDID=0&intValidationID=1', '#loadTypes-' + index);
            $('#eValidationTypeList-'+index).select2();
        };
</script>