使用JavaScript在HTML表中动态添加行并提交它们的值(PHP)

使用JavaScript在HTML表中动态添加行并提交它们的值(PHP),javascript,php,Javascript,Php,我最近访问了这个网站,能够修改代码,以html形式将行动态添加到表中。我的问题是下一步:单击submit按钮提交输入字段的值。问题是,这些字段是在用户单击“添加”按钮时创建的,但表单不会将这些值发送到数据库(我使用的是php)。为了使此函数正常工作,我已经使用了,但可能我仍然缺少一个将数组信息发送到字段的重要语法: <style> .inputThis { border: none;} .textareaThis {

我最近访问了这个网站,能够修改代码,以html形式将行动态添加到表中。我的问题是下一步:单击submit按钮提交输入字段的值。问题是,这些字段是在用户单击“添加”按钮时创建的,但表单不会将这些值发送到数据库(我使用的是php)。为了使此函数正常工作,我已经使用了,但可能我仍然缺少一个将数组信息发送到字段的重要语法:

 <style>
    .inputThis {
        border: none;}
        .textareaThis {
            border: 0px; width: 100%; height: 25px;}
            .pvaW {
                
                width:46%;
                }
    </style> 
  
      <script language="JavaScript">
        function addRow(tableID) {
        var table = document.getElementById(tableID);

        var rowCount = table.rows.length;
        var row = table.insertRow(rowCount);

        var cell1 = row.insertCell(0);
        var element1 = document.createElement("input");
        element1.type = "text";
        element1.name="Item4[]";
       element1.className="inputThis";
      cell1.appendChild(element1);

        var cell2 = row.insertCell(1);
       var element2 = document.createElement("input");
       element2.type = "text";
        element2.name = "HowMany4[]";
         element2.className="inputThis";
        cell2.appendChild(element2);
        

 var cell3 = row.insertCell(2);
       var element3 = document.createElement("textarea");
        element3.type = "text";
        element3.name = "WhereHowUsed4[]";
         element3.className="textareaThis";
        cell3.appendChild(element3);
        
        
          var cell4 = row.insertCell(3);
       var element4 = document.createElement("input");
        element4.type = "text";
        element4.name = "Cost4[]";
         element4.className="inputThis";
        cell4.appendChild(element4);
        
        
          var cell5 = row.insertCell(4);
       var element5 = document.createElement("textarea");
        element5.type = "text";
        element5.name = "ConCur4[]";
         element5.className="textareaThis";
        cell5.appendChild(element5);
         
        
              var cell6 = row.insertCell(5);
       var element6 = document.createElement("textarea");
        element6.type = "text";
        element6.name = "Benefit4[]";
         element6.className="textareaThis";
        cell6.appendChild(element6);
        
        
              var cell7 = row.insertCell(6);
       var element7 = document.createElement("textarea");
        element7.type = "text";
        element7.name = "ItemComments4[]";
         element7.className="textareaThis";
        cell7.appendChild(element7);
        
    }
    </script>
 </head>
  <body>
     <form action="post.php" method="post" name="form1">
 <table id="tab" cellpadding="0" cellspacing="0" width="100%" class="table-striped">
<tbody>
<tr>
<td><input name="Item4[]" type="text" style="border: 0px;" /></td>
<td><input name="HowMany4[]" type="text" style="border: 0px;"/></td>
<td><textarea name="WhereHowUsed4[]" type="text" style="border: 0px; width: 100%; height: 25px;"></textarea></td>
<td><input name="Cost4[]"  type="text" style="border: 0px;"/></td>
<td><textarea name="ConCur4[]"  type="text" style="border: 0px; width: 100%; height: 25px;"></textarea></td>
 <td><textarea name="Benefit4[]" type="text" style="border: 0px; width: 100%; height: 25px;"></textarea></td>
 <td><textarea name="ItemComments4[]" type="text" style="border: 0px; width: 100%; height: 25px;"></textarea></td></tr></tbody></table>  

<div class="push-right" style="margin-top: 5px;">
<input type="button"  class="btn btn-success" id="add" value="+" name="Add" onclick="addRow('tab')"/>
</div> 
 <button class="btn btn-success" type="submit"> Submit</button>                            
                                    </form> 
 </body>

//php posting syntax from the post.php page
//////////////////
<head>

<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta name="description" content="My Company">
<meta name="keywords" content="post">
<meta name="expires" content="never" />
<title>My Site</title>

</head>
<body>

Adding into the database....


 <?php
 $SPProxyServices = "http://--IP--:0000"; 
error_reporting(E_ALL);
ini_set('display_errors', 1);
//General
$dbfieldName1 = "Item4"; $this1= $_POST['Item4'];
$Post41 = implode("~ ", $this1);
$dbfieldName2 = "Cost4"; $this2= $_POST['Cost4'];
$Post42 = implode("~ ", $this2);
$dbfieldName3 = "HowMany4"; $this3= $_POST['HowMany4'];
$Post43 = implode("~ ", $this3);
$dbfieldName4 = "Benefit4"; $this4= $_POST['Benefit4'];
$Post44 = implode("~ ", $this4);
$dbfieldName5 = "ConCur4"; $this5= $_POST['ConCur4'];
$Post45 = implode("~ ", $this5);
$dbfieldName6 = "WhereHowUsed4"; $this6= $_POST['WhereHowUsed4'];
$Post46 = implode("~ ", $this6);


$client = new SoapClient($SPProxyServices."/");
$params->SPWebURL = "/";
$params->ListName = "/";
$params->BatchStr = "<Batch OnError=\"Continue\" ListVersion=\"1\" >
<Method ID=\"1\" Cmd=\"New\">
<Field Name='$dbfieldName1'>".$Post41."</Field>
<Field Name='$dbfieldName2'>".$Post42."</Field>
<Field Name='$dbfieldName3'>".$Post43."</Field>
<Field Name='$dbfieldName4'>".$Post44."</Field>
<Field Name='$dbfieldName5'>".$Post45."</Field>
<Field Name='$dbfieldName6'>".$Post46."</Field>
 </Method></Batch>";

 $result = $client->UpdateListItems($params);
 $simpleresult = $result; //->ListsGetListItemsResult; 

.输入他的{
边框:无;}
.这个{
边框:0px;宽度:100%;高度:25px;}
普瓦夫先生{
宽度:46%;
}
函数addRow(tableID){
var table=document.getElementById(tableID);
var rowCount=table.rows.length;
var row=table.insertRow(rowCount);
var cell1=行插入单元格(0);
var element1=document.createElement(“输入”);
element1.type=“text”;
element1.name=“Item4[]”;
元素1.className=“inputThis”;
单元格1.附加子元素(元素1);
var cell2=行插入单元格(1);
var element2=document.createElement(“输入”);
element2.type=“text”;
element2.name=“HowMany4[]”;
element2.className=“inputThis”;
第2单元。附加子元素(元素2);
var cell3=行插入单元格(2);
var element3=document.createElement(“textarea”);
element3.type=“text”;
element3.name=“WhereHowUsed4[]”;
element3.className=“textareaThis”;
第三单元附属物(第三单元);
var cell4=行插入单元格(3);
var element4=document.createElement(“输入”);
element4.type=“text”;
element4.name=“Cost4[]”;
元素4.className=“inputThis”;
第四单元附属物(第四单元);
var cell5=行插入单元格(4);
var element5=document.createElement(“textarea”);
element5.type=“text”;
element5.name=“ConCur4[]”;
element5.className=“textareaThis”;
第五单元附属物(第五单元);
var cell6=行插入单元格(5);
var element6=document.createElement(“textarea”);
element6.type=“text”;
element6.name=“Benefit4[]”;
element6.className=“textareaThis”;
第六单元附属物(第六单元);
var cell7=行插入单元格(6);
var element7=document.createElement(“textarea”);
element7.type=“text”;
element7.name=“ItemComments4[]”;
element7.className=“textareaThis”;
第七单元附属物(第七单元);
}
提交
//来自post.php页面的php发布语法
//////////////////
我的网站
正在向数据库中添加。。。。

我已经更新了代码以显示所有内容。感谢您提供的任何帮助--我也是javascript新手,所以我希望我已经添加了足够的信息。如果您更新了代码,请将发送到服务器的标题信息发布到Submit上,好吗。这是一个内容管理站点,存储通过表单传递的所有数据,我已授予表单对列表/库的贡献级别权限。因此,页面中没有存储用户名或密码。对,查看标题信息中动态创建的字段,数据甚至不存在。这就好像代码完全忽略了这些字段——硬编码字段在标题信息中,而动态创建的字段则不在其中。我的一个好朋友解决了这个问题——我有一个很长的“div”标记。把整件事都扔了。。。。继续下一次冒险。。。