javascript - 添加动态行后，我无法使用 php 发送数据

Question

我已经以表格形式制作了一个表格，它动态添加行，但是当我在填充数据后提交时，它只获得最后填充的一个数据行。

请帮我获取mysql数据表中的所有数据。

这是我的 html 代码

 var count = "1";
  function addRow(in_tbl_name)
  {
    var tbody = document.getElementById(in_tbl_name).getElementsByTagName("TBODY")[0];
    // create row
    var row = document.createElement("TR");
    // create table cell 1
    var td1 = document.createElement("TD")
    var strHtml1 = "<INPUT TYPE=\"text\" NAME=\"r_name\"PLACEHOLDER=\"Name\" >";
  
   
    td1.innerHTML = strHtml1.replace(/!count!/g,count);
    // create table cell 2
    var td2 = document.createElement("TD")
    var strHtml2 = "<INPUT TYPE=\"text\" NAME=\"r_desc\" PLACEHOLDER=\"description\" >";
    td2.innerHTML = strHtml2.replace(/!count!/g,count);
    // create table cell 3
    var td3 = document.createElement("TD")
    var strHtml3 = "<INPUT TYPE=\"text\" NAME=\"r_qty\" PLACEHOLDER=\"QTY\" NINPUT=\"calculate()\">";
    td3.innerHTML = strHtml3.replace(/!count!/g,count);
    // create table cell 4
    var td4 = document.createElement("TD")
    var strHtml4 = "<INPUT TYPE=\"text\" NAME=\"r_RATE\" PLACEHOLDER=\"rate\" ONINPUT=\"calculate()\" >";
    td4.innerHTML = strHtml4.replace(/!count!/g,count);
    // create table cell 5
   
	 // create table cell 4
    var td5 = document.createElement("TD")
    var strHtml5 = "<INPUT TYPE=\"Button\" CLASS=\"Button\" onClick=\"delRow()\" VALUE=\"Delete Row\">";
	
    td5.innerHTML = strHtml5.replace(/!count!/g,count);
	
    // append data to row
    row.appendChild(td1);
    row.appendChild(td2);
    row.appendChild(td3);
    row.appendChild(td4);
    row.appendChild(td5);
	
    // add to count variable
    count = parseInt(count) + 1;
    // append row to table
    tbody.appendChild(row);
  }
  function delRow()
  {
    var current = window.event.srcElement;
    //here we will delete the line
    while ( (current = current.parentElement)  && current.tagName !="TR");
         current.parentElement.removeChild(current);
  }

 <div class="table-responsive">
                  
   <table  ID="tblPets" class="table  table-bordered table-hover">  
  
  <thead>  
  
        <tr>  
  
            <th><center>Row material Name</center></th> 
			<th><center>Description</center></th> 
            
            <th><center>Qty.</center></th> 
           
            <th><center>Rate</center></th> 
           
            <th><center><INPUT TYPE="Button" onClick="addRow('tblPets')" VALUE="Add Row"></center></th>  

			
			
        </tr>  
		</thead>
		
		 <tbody >
		<tr>  
  <form action="add_item - Copy.php" method="post">
            <th><INPUT TYPE="text" NAME="r_name" PLACEHOLDER="Name"></th> 
			<th><INPUT TYPE="text" NAME="r_desc" PLACEHOLDER="description" ></th> 
            
            <th><INPUT TYPE="text" NAME="r_qty" PLACEHOLDER="QTY" ONINPUT="calculate()" ></th> 
           
            <th><INPUT TYPE="text" NAME="r_RATE" PLACEHOLDER="rate" ONINPUT="calculate()"></th> 
            <th></th>  

        </tr>
		</tbody>
		  <tfoot>
    <tr>
      <td> <input type="submit" name="sub" value="Submit"></td>
      <td></td>
    </tr>
  </tfoot>
		</form>
        
		
		
                                </table>
  
  </div>
            		

这是插入数据的 php 代码

    if(isset($_POST['sub'])) { 


    $r_nm=$_POST['r_name'];

    $r_qty=$_POST['r_qty'];
    $r_rate=$_POST['r_RATE'];
$insert_rm="insert into tbl_row_material (rm_name,rm_qty, rm_rate) VALUE ('$r_nm','$r_qty','$r_rate')"; 
mysqli_query($dbcon,$insert_rm);
}

Answer 1

试试这个

if(isset($_POST['sub'])) 
 { 
    $r_nm=$_POST['r_name'];
    $r_qty=$_POST['r_qty'];
    $r_rate=$_POST['r_RATE'];

    $insert_rm="insert into tbl_row_material (rm_name,rm_qty, rm_rate) VALUES ('$r_nm','$r_qty','$r_rate')";  
    mysqli_query($dbcon,$insert_rm); 
}