Question

我有这样的表：

<form name="frm_data_nasabah2" method="post" enctype="application/x-www-form-urlencoded" action="<?php echo $page_action;?>">       

        <table class="table table-bordered table-hover" id="tab_logic_usaha1" border="1" width="80%">
            <thead>
                <tr style="background: rgb(227,241,252)">
                    <th class="text-center" align="center">
                        No
                    </th>
                    <th class="text-center" align="center">
                        Nama Pemegang Saham
                    </th>
                    <th class="text-center" align="center">
                        %tase Saham
                    </th>
                    <th class="text-center" align="center" >
                        Icon
                    </th>
                </tr>
            </thead>

            <tbody>
            <?php 
            $loop = 1;

            foreach($PEMEGANGSAHAM as $saham){ ?>
                <tr id='addr<?php echo $loop; ?>_usaha1' >
                    <td>
                    <?php echo $loop;
                        ?>
                    </td>
                    <td>
                        <input type="text" name='Nama_Pemegang_Saham[]'  class="form-control" value="<?php echo $saham->NAMA_PEMEGANG_SAHAM; ?>" required/>
                    </td>
                    <td>
                        <input type="text" name='tase_Saham[]' value="<?php echo $saham->PER_SAHAM; ?>" class="form-control" required/>
                    </td>
                    <td>
                        <center>        
                            <img src="http://brftst.bni.co.id/tap.dev/public/images/imagesManageDebitur/delete.png" 
                                onclick="confirm_Delete_Usaha1(<?php echo $saham->ID_USAHA; ?>)" height="20" width="20" />  
                        </center>
                    </td>
                </tr>
               <?php $inputSaham++;
                        $loop++;
                        $row1++;
                ?>
            <?php } ?>
            </tbody>
        </table>
        <br/>

        <input name="submitTab" value="Submit" type="submit">
        <input type="hidden" name="id_num" value="<?php echo $debiturId;?>" />
        <input type="hidden" name="submit_segment" value="usaha_saham" />
        <input type="hidden" name="rowNum" value="<?php echo $row1; ?>" />
</form>

我有这样的javascript：

var i=<?php echo $loop; ?>;
     $("#add_row_usaha1").click(function(){
      $('#addr'+(i)+'_usaha1').html("<td>"+ (i-1) +"</td><td><input name='Nama_Pemegang_Saham"+i+"' type='text' class='form-control input-md' required/> </td>"+
                            "<td><input name='tase_Saham"+i+"' type='text' class='form-control input-md' required/></td>"+"<td>"
                            //+"<center><img src='http://brftst.bni.co.id/tap.dev/public/images/imagesManageDebitur/edit.png' height='20' width='20'/>  "
                            //+"<img src='http://brftst.bni.co.id/tap.dev/public/images/imagesManageDebitur/delete.png' height='20' width='20'/></center>"
                            +"<center><img src='http://brftst.bni.co.id/tap.dev/public/images/imagesManageDebitur/deleteRow.png' height='20' width='20' onclick='deleteRow("+i+")'/></center>"
                            +"</td><?php $row1++; ?>");
      $('#tab_logic_usaha1').append('<tr id="addr'+(i+1)+'_usaha1"></tr>');
      i++;

      });

另一个功能：

    function deleteRow(input){
            if(input>1){
                $("#addr"+input+"_usaha1").html('');
                input--;
            }
        }

当我尝试删除第5行，并再次添加一些行时，结果如下：

行数与索引不同。我该如何解决这个问题？

Answer 1

function deleteRow(input){
    alert('masuk');
    if(input>1){
        todelete=document.getElementById("addr"+input+"_usaha1");
        todelete.parentNode.removeChild(todelete);
        i--;
    }
}

另一个修复：修复附加元素，然后添加其innerHTML

    var i=<?php echo $loop; ?>;
         $("#add_row_usaha1").click(function(){
  $('#tab_logic_usaha1').append('<tr id="addr'+(i+1)+'_usaha1"></tr>');
          $('#addr'+(i)+'_usaha1').html("<td>"+ (i-1) +"</td><td><input name='Nama_Pemegang_Saham"+i+"' type='text' class='form-control input-md' required/> </td>"+
                                "<td><input name='tase_Saham"+i+"' type='text' class='form-control input-md' required/></td>"+"<td>"
                                //+"<center><img src='http://brftst.bni.co.id/tap.dev/public/images/imagesManageDebitur/edit.png' height='20' width='20'/>  "
                                //+"<img src='http://brftst.bni.co.id/tap.dev/public/images/imagesManageDebitur/delete.png' height='20' width='20'/></center>"
                                +"<center><img src='http://brftst.bni.co.id/tap.dev/public/images/imagesManageDebitur/deleteRow.png' height='20' width='20' onclick='deleteRow("+i+")'/></center>"
                                +"</td><?php $row1++; ?>");

          i++;

          });

自动在html中添加行

1 个答案: