表单提交按钮/刷新页面
[英]Form Submit Button / Refreshing Page
问题描述
我正在寻找有关在推送表单提交按钮上重新加载页面的解决方法的建议。 我有一个jQuery click事件，可使用AJAX将信息从表单发送到php文件，该文件会检查从表单收集的数据，然后将其推入数据库。 PHP文件会收集信息，无论是信息丢失还是提交成功，然后通过AJAX将信息带回到主页。 然后将该信息推送到页面上的错误消息div中，以判断是否存在问题或一切成功。 当我在没有AJAX的情况下在一页纸上进行所有操作时，这种方法效果很好，但是由于涉及的内容更多，因此我决定将所有内容分解一些以使内容保持整洁。 当使用if(array_key_exists("submit",$_POST)) { ，似乎几乎在刷新发生后就这样做了？ 因此，错误消息在那里。 当像我目前这样使用AJAX时，虽然好像错误消息在刷新之前就已加载，所以丢失了。 这是我正在使用的：
<?php
include("header.html");
include("connection.php");
$query= "SELECT * FROM components";
if($result = mysqli_query($link, $query)) {
$basedrop1="<p id='bd1'><select name='basedrop1' id='basedrop1' class='prodinp'> <option>Select A Base Product</option>";
$basedrop2="<p id='bd2'><select name='basedrop2' id='basedrop2' class='prodinp'> <option>Select A Base Product</option>";
$coatingdrop1="<p id='ctd1'><select name='coatingdrop' id='coatingdrop1' class='prodinp'> <option>Select A Coating</option>";
$coatingdrop2="<p id='ctd2'><select name='coatingdrop' id='coatingdrop2' class='prodinp'> <option>Select A Coating</option>";
$toppingdrop1="<p id='td1'><select name='toppingdrop' id='toppingdrop1' class='prodinp'> <option>Select A Topping</option>";
$toppingdrop2="<p id='td2'><select name='toppingdrop' id='toppingdrop2' class='prodinp'> <option>Select A Topping</option>";
$filmdrop1="<p id='fd1'><select name='filmdrop' id='filmdrop1' class='inp'> <option>Select A Film</option>";
$filmdrop2="<p id='fd2'><select name='filmdrop' id='filmdrop2' class='inp'> <option>Select A Film</option>";
$filmdrop3="<p id='fd3'><select name='filmdrop' id='filmdrop3' class='inp'> <option>Select A Film</option>";
$corrugatedrop1="<p id='cd1'><select name='corrugatedrop' id='corrugatedrop1' class='prodinp'> <option>Select Corrugate</option>";
$corrugatedrop2="<p id='cd2'><select name='corrugatedrop' id='corrugatedrop2' class='prodinp'> <option>Select Corrugate</option>";
$corrugatedrop3="<p id='cd3'><select name='corrugatedrop' id='corrugatedrop3' class='prodinp'> <option>Select Corrugate</option>";
$corrugatedrop4="<p id='cd4'><select name='corrugatedrop' id='corrugatedrop4' class='prodinp'> <option>Select Corrugate</option>";
$palletdrop="<p id='pd1'><select name='palletdrop' id='palletdrop' class='inp'> <option>Select A Pallet Type</option>";
while ($row=mysqli_fetch_array($result)) {
if ($row[9]=="base") {
$basedrop1.=" <option value=".$row[0].">".$row[2]." - ".$row[1]."</option>";
$basedrop2.=" <option value=".$row[0].">".$row[2]." - ".$row[1]."</option>";
}
if ($row[9]=="coating") {
$coatingdrop1.=" <option value=".$row[0].">".$row[2]." - ".$row[1]."</option>";
$coatingdrop2.=" <option value=".$row[0].">".$row[2]." - ".$row[1]."</option>";
}
if ($row[9]=="topping") {
$toppingdrop1.=" <option value=".$row[0].">".$row[2]." - ".$row[1]."</option>";
$toppingdrop2.=" <option value=".$row[0].">".$row[2]." - ".$row[1]."</option>";
}
if ($row[9]=="film") {
$filmdrop1.=" <option value=".$row[0].">".$row[2]." - ".$row[1]."</option>";
$filmdrop2.=" <option value=".$row[0].">".$row[2]." - ".$row[1]."</option>";
$filmdrop3.=" <option value=".$row[0].">".$row[2]." - ".$row[1]."</option>";
}
if ($row[9]=="corrugate") {
$corrugatedrop1.=" <option value=".$row[0].">".$row[2]." - ".$row[1]."</option>";
$corrugatedrop2.=" <option value=".$row[0].">".$row[2]." - ".$row[1]."</option>";
$corrugatedrop3.=" <option value=".$row[0].">".$row[2]." - ".$row[1]."</option>";
$corrugatedrop4.=" <option value=".$row[0].">".$row[2]." - ".$row[1]."</option>";
}
if ($row[9]=="pallet") {
$palletdrop.=" <option value=".$row[0].">".$row[2]." - ".$row[1]."</option>";
}
}
$basedrop1.=" </select> <input name='company' id='basep1' class ='perinp' type='text' placeholder='Base %'></p>";
$basedrop2.=" </select> <input name='company' id='basep2' class ='perinp' type='text' placeholder='Base %'></p>";
$coatingdrop1.=" </select> <input name='company' id='coatp1' class ='perinp' type='text' placeholder='Coating %'></p>";
$coatingdrop2.=" </select> <input name='company' id='coatp2' class ='perinp' type='text' placeholder='Coating %'></p>";
$toppingdrop1.=" </select> <input name='company' id='topp1' class ='perinp' type='text' placeholder='Topping %'></p>";
$toppingdrop2.=" </select> <input name='company' id='topp2' class ='perinp' type='text' placeholder='Topping %'></p>";
$filmdrop1.=" </select></p>";
$filmdrop2.=" </select></p>";
$filmdrop3.=" </select></p>";
$corrugatedrop1.=" </select> <input name='company' id='corc1' class ='perinp' type='text' placeholder='Pieces/Unit'></p>";
$corrugatedrop2.=" </select> <input name='company' id='corc2' class ='perinp' type='text' placeholder='Pieces/Unit'></p>";
$corrugatedrop3.=" </select> <input name='company' id='corc3' class ='perinp' type='text' placeholder='Pieces/Unit'></p>";
$corrugatedrop4.=" </select> <input name='company' id='corc4' class ='perinp' type='text' placeholder='Pieces/Unit'></p>";
$palletdrop.=" </select></p>";
}
?>
<html>
<body>
<div id="main">
<div id="error"><?php echo $error; ?></div>
<h2>Add A Product:</h2>
<form method = "post">
<p><input name="prodname" id="prodname" class ="inp" type="text" placeholder="Item Name"></p>
<p><input name="prodnumber" id="prodnumber" class ="inp" type="text" placeholder="Item #"></p>
<p><input name="prodweight" id="prodweight" class ="inp" type="text" placeholder="Product Weight (in Pounds)"></p>
<p><input name="prodcount" id="prodcount" class ="inp" type="text" placeholder="Bag Count (Per Unit)"></p>
<h2>Ingredients:</h2>
<?php echo $basedrop1; ?>
<?php echo $basedrop2; ?>
<p id="addbase">Add A Base Item</p>
<?php echo $coatingdrop1; ?>
<?php echo $coatingdrop2; ?>
<p id="addcoating">Add A Coating</p>
<?php echo $toppingdrop1; ?>
<?php echo $toppingdrop2; ?>
<p id="addtopping">Add A Topping</p>
<h2>Materials:</h2>
<?php echo $filmdrop1; ?>
<?php echo $filmdrop2; ?>
<?php echo $filmdrop3; ?>
<p id="addfilm">Add A Film</p>
<?php echo $corrugatedrop1; ?>
<?php echo $corrugatedrop2; ?>
<?php echo $corrugatedrop3; ?>
<?php echo $corrugatedrop4; ?>
<p id="addcorrugate">Add Corrugate</p>
<?php echo $palletdrop; ?>
<p><input type="submit" name="submit" id="submitbutton" value = "Submit"></p>
</form>
</div>
<script type="text/javascript">
document.getElementById('error').style.display="none";
document.getElementById('bd2').style.display="none";
document.getElementById('ctd2').style.display="none";
document.getElementById('td2').style.display="none";
document.getElementById('fd2').style.display="none";
document.getElementById('fd3').style.display="none";
document.getElementById('cd2').style.display="none";
document.getElementById('cd3').style.display="none";
document.getElementById('cd4').style.display="none";
$('#addbase').click(function(){
document.getElementById('bd2').style.display="block";
document.getElementById('addbase').style.display="none";
});
$('#addcoating').click(function(){
document.getElementById('ctd2').style.display="block";
document.getElementById('addcoating').style.display="none";
});
$('#addtopping').click(function(){
document.getElementById('td2').style.display="block";
document.getElementById('addtopping').style.display="none";
});
$('#addfilm').click(function(){
if(document.getElementById('fd2').style.display=="none"){
document.getElementById('fd2').style.display="block";
}else {
document.getElementById('fd3').style.display="block";
document.getElementById('addfilm').style.display="none";
}
});
$('#addcorrugate').click(function(){
if(document.getElementById('cd2').style.display=="none"){
document.getElementById('cd2').style.display="block";
}else if(document.getElementById('cd3').style.display=="none") {
document.getElementById('cd3').style.display="block";
} else if(document.getElementById('cd4').style.display=="none"){
document.getElementById('cd4').style.display="block";
document.getElementById('addcorrugate').style.display="none";
}
});
$('#submitbutton').click(function() {
$.ajax({
method: "POST",
url: "addprod.php",
data: {
prodname:$('#prodname').val(),
prodnumber:$('#prodnumber').val(),
prodweight:$('#prodweight').val(),
prodcount:$('#prodcount').val(),
basedrop1:$('#basedrop1').val(),
basedrop2:$('#basedrop2').val(),
coatingdrop1:$('#coatingdrop1').val(),
coatingdrop2:$('#coatingdrop2').val(),
toppingdrop1:$('#toppingdrop1').val(),
toppingdrop2:$('#toppingdrop2').val(),
filmdrop1:$('#filmdrop1').val(),
filmdrop2:$('#filmdrop2').val(),
filmdrop3:$('#filmdrop3').val(),
corrugatedrop1:$('#corrugatedrop1').val(),
corrugatedrop2:$('#corrugatedrop2').val(),
corrugatedrop3:$('#corrugatedrop3').val(),
corrugatedrop4:$('#corrugatedrop4').val(),
palletdrop:$('#palletdrop').val(),
basep1:$('#basep1').val(),
basep2:$('#basep2').val(),
coatp1:$('#coatp1').val(),
coatp2:$('#coatp2').val(),
topp1:$('#topp1').val(),
topp2:$('#topp2').val(),
corc1:$('#corc1').val(),
corc2:$('#corc2').val(),
corc3:$('#corc3').val(),
corc4:$('#corc4').val()
}
})
.done(function( msg ) {
document.getElementById('error').style.display="block";
$('#error').html(msg);
});
});
</script>
</body>
</html>
<?php include("footer.html"); ?>
1 个解决方案
解决方案1
1 2016-11-03 21:11:35
将您的按钮从type =“ submit”更改为type =“ button”。 提交按钮在单击时自动提交嵌入它们的表单。
为什么即使表单调用的函数末尾存在“ return false”，表单上的“提交”按钮仍会刷新页面？
[英]Why does the 'submit' button on form keep refreshing the page even with presence of 'return false' at the end of the functioned called by the form?
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.