表單提交按鈕/刷新頁面
[英]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.