我正在使用jquery创建一个php表单。尝试动态添加行,然后提交到另一个插入数据的页面。
这是一种商店库存形式,可以以一种形式提供多种产品,而不是添加一种产品并再次进行整个流程。我还有另一种提交相同数据的表格,它插入了单行数据并且工作正常,我正在努力改善这一点。如果我注释掉添加行和删除行功能,则提交作品,但仅适用于一行。反之亦然,如果我注释掉“提交”按钮和功能,则可以动态添加和删除行。还不清楚如何通过将ajax连接到php来发布数据来发布多行数据。另外,我还需要发布附件文件,该文件将以pdf格式输入id = Annexure。
<html lang="en">
<head>
<meta charset="utf-8">
</head>
<body>
<form action="insert_indents.php" method="post" name="indform" id="indform">
<label for="Part_No">Part No.:</label>
<input type="text" id="Part_No" name="Part_No" placeholder="Part No">
<label for="Part_Make">Part Make:</label>
<input type="text" id="Part_Make" name="Part_Make" placeholder="Part Make">
<label for="Annexure">Attach File:
<input type="hidden" id="MAX_FILE_SIZE" value="30000" />
<input id="Annexure" name="Annexure" type="file" class="form-control" style='width:20em'/>
</label>
<input type="button" class="add-row" value="Add Row">
<input type="button" id="Submit" class="ind-row" id ="Submit" value="Submit" onclick="add_indent_details()" />
</form>
<table>
<thead>
<tr>
<th>Select</th>
<th>Part No</th>
<th>Part Make</th>
<th>Attached File</th>
</tr>
</thead>
<tbody>
<tr>
</tr>
</tbody>
</table>
<button type="button" class="delete-row">Delete Row</button>
<script src="js/jquery-1.4.1.min.js"></script>
<script src="js/ajax.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".add-row").click(function(){
var Part_No = $("#Part_No").val();
var Part_Make = $("#Part_Make").val();
var Annexure= $("#Annexure").val();
var markup = "<tr><td><input type='checkbox' name='record'></td><td>" + Part_No +"</td><td>" + Part_Make +"</td><td>" + Annexure+ "</td></tr>";
$("table tbody").append(markup);
});
// Find and remove selected table rows
$(".delete-row").click(function(){
$("table tbody").find('input[name="record"]').each(function(){
if($(this).is(":checked")){
$(this).parents("tr").remove();
}
});
});
});
</script>
<script>
$(document).ready(function(){
$("#Submit").click(function(){
var Part_No = $("#Part_No").val();
var Part_Make = $("#Part_Make").val();
var Annexure= $("#Annexure").val();
$.ajax({
url:'insert_indents.php',
type :'post',
data :{Part_No:Part_No,Part_Make:Part_Make,Annexure:Annexure},
datatype :'text',
success:function(data)
{
alert(data);
}
});
}
}
</script>
</body>
</html>
我想将数据和附加文件一起插入到我的数据库中,并将此数据发布到包含插入查询的其他页面上。 谢谢你的帮助。 我是PHP和Ajax的新手。