0
我正在使用jQuery（版本1.8.1）與PHP（版本5.3）提交表單添加到mySQL數據庫中的條目，發生了什麼事情是在第一次提交一切是沒問題，但對於每次後續提交而沒有頁面刷新，它都會添加一個附加條目使用jQuery ajax和PHP重複條目到mySQL
此外，我還在UI中使用Bootstrap（版本2.1.1）和Jasny for Bootstrap（版本j1a）的上載小部件。我尚未將上傳小部件連接到處理或提交，因爲我在實施時檢測到重複問題。
請注意，這是一個概念驗證系統，所以代碼很粗糙，因爲我不打算投資清理它，直到項目確認。由於這個原因，你會注意到一些內聯的mySQL查詢，我知道這不是最好的方式，但是它可以用於演示，並且稍後會被清理。此外，作爲POC系統，它目前位於內部服務器上，我可以共享代碼，但不幸在此時不能顯示示例網站。作爲一個例子，「公司1」的第一篇文章爲「公司1」添加了1條記錄，「公司2」的第二條記錄爲「公司2」添加了2條記錄， 「公司3」的第三筆記錄爲「公司3」增加了3筆記錄等等。如果我以任何方式重新加載表單頁面（刷新或新的請求），問題將從第一次提交重新開始。
我正在使用jQuery serialize和ajax將數據發佈到PHP處理器。我記錄了處理器收到的所有帖子，並且我看到處理器正在從表單中接收多條記錄，我認爲這可能是由PHP中的foreach循環引起的，但事實並非如此。
我已經刪除了jQuery函數，它每次都能正常工作，並且沒有任何正常PHP提交中的重複。 我已經手動處理通過jQuery而不是serialize條目，但由於有一個PHP動態數組我仍然使用該數組上serialize，這產生了重複如上所述。 我已經搜索了幾天的問題，但無法找到任何明確的問題來解決這個問題，所有看起來相關的博客和論壇上的建議都無效，我嘗試了大約10-15個不同的選項。
所有這些的結合讓我相信這個問題來自於jQuery serialize和/或ajax函數，但是我現在每次看這個代碼都會看到我的眼睛。
我也在考慮將表單放在外部文件中，並通過ajax重新加載新的表單或清理表單，通過jQuery爲每個新條目重新設置默認值，但是我不相信這些方法都能解決問題。
任何幫助非常感謝，在此先感謝您的幫助！
jQuery代碼
<script>
$(document).ready(function() {
$('.fileupload').fileupload('name:logo');
$('.help-inline').hide();
$("#btn_process").click(function() {
$('form').submit(function() {
$('.help-inline').hide();
var company_name = $("#company_name").val();
if (company_name === "") {
$("div#name_group").addClass("error");
$("span#name_error").show();
return false;
}
var dataString = $('form').serialize();
$.ajax({
type: "POST",
url: "inc/addcompany.php",
data: dataString,
success: function(html) {
if(html === 'success')
{
$('#message')
.addClass("label label-success")
.css("margin-bottom","20px")
.html("<h3>Login successful</h3><p>Company added</p>")
.slideDown(1500, function() {});
}
else
{
$('#message')
.addClass("label label-important")
.css("margin-bottom","20px")
.html("<h3>Error</h3><p>There was an error, please check the information and try again</p>")
.slideDown(1500, function() {});
$("div#name_error").addClass("error");
$("span#name_error").show();
$("div#type_error").addClass("error");
$("span#type_error").show();
return false;
}
}
});
return false;
});
});
});
</script>
HTML標記
<form class="form-horizontal" id="add_company" method="POST" action="">
<fieldset>
<div id="message"></div>
<div id="name_group" class="control-group">
<label class="control-label" for="company_name">Company name </label>
<div class="controls">
<input type="text" id="company_name" name="company_name" />
<span id="name_error" class="help-inline">This needs to be more than 3 characters</span>
</div>
</div>
<div id="type_group" class="control-group">
<label class="control-label">Company type </label>
<div class="controls">
<?
$sql = "SELECT description,id FROM types ORDER BY description";
$qry = mysql_query($sql) or die("ERROR: could not get company types => ".mysql_error());
while($company_type = mysql_fetch_array($qry)) {
echo '
<label class="checkbox inline"><input type="checkbox" name="type[]" value="'.$company_type['id'].'" /> '.$company_type['description'].' </label>';
}
?>
<span id="type_error" class="help-inline">Please select a minimum of 1 type</span>
</div>
</div>
<div id="website_group" class="control-group">
<label class="control-label" for="website">Website </label>
<div class="controls">
<input type="text" id="website" name="website" placeholder="www.something.com" />
</div>
</div>
<div id="logo_group" class="control-group">
<label class="control-label">Logo </label>
<div class="controls">
<div class="fileupload fileupload-new" data-provides="fileupload">
<div class="fileupload-new thumbnail" style="width: 50px; height: 50px;"><img src="/img/50x50.png" /></div>
<div class="fileupload-preview fileupload-exists thumbnail" style="width: 50px; height: 50px;"></div>
<span class="btn btn-file"><span class="fileupload-new">Select image</span>
<span class="fileupload-exists">Change</span>
<input type="file" /></span>
<a href="#" class="btn fileupload-exists" data-dismiss="fileupload">Remove</a>
</div>
</div>
</fieldset>
<input type="hidden" name="action" value="add_company" />
<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
<button class="btn btn-primary" name="btn_process" id="btn_process">Save changes</button>
</form>
的PHP處理器
$error = false;
$error_company_name = false;
$error_type = false;
$error_website = false;
$company_name = $_REQUEST['company_name'];
$type = $_REQUEST['type'];
$website = $_REQUEST['website'];
$logo = $_REQUEST['logo'];
if(empty($company_name)) {
$error = true;
$error_company_name = true;
}
include_once('db.php');
$sql = "SELECT description,id FROM company_types";
$qry = mysql_query($sql) or die("ERROR: could not get company types => ".mysql_error());
$type_count = 0;
while($array = mysql_fetch_array($qry)) {
$type_count = $type_count+1;
}
if($type_count == 0) {
$error = true;
$error_type = true;
}
$ic = 0;
foreach($_REQUEST['type'] as $item) {
$ic = $ic+1;
}
if($ic == 0) {
$error = true;
$error_type = true;
}
if(isset($website) && $website != ' ') {
$url = 'http://'.$website;
if(!filter_var($url, FILTER_VALIDATE_URL)) {
$error = true;
$error_website = true;
}
}
if($error == false) {
$sql = "INSERT INTO company_list (name,website,logo) VALUES('$company_name','$website','$logo')";
$qry = mysql_query($sql) or die ("ERROR: could not add company => ".mysql_error());
$company_id = mysql_insert_id($link);
if($company_id == '' || $company_id == null || empty($company_id)) {
echo 'fail';
exit;
}
foreach($_REQUEST['type'] as $company_type) {
$sql = "INSERT INTO companies_types (companies_id,type_id) VALUES('$company_id','$company_type')";
$qry = mysql_query($sql) or die("ERROR: could not link company type: => ".mysql_error());
}
echo 'success';
}
我沒有看到你是如何刷新頁面，無論如何..也許我只是今天累了:-)。我們可以看到這在行動？只要你想在你的.html（）之前試試hide（）或remove（）;即$（selector）.remove（）.html（'blah'）也在您的點擊中，甚至嘗試添加event.stopImmediatePropagation（）; – xlordt
您是否在隨後的點擊中在控制檯中看到多個ajax調用？ –
@xlordt發佈的代碼有問題的代碼使用jQuery AJAX提交因此在代碼中沒有刷新，我已刪除了jQuery和沒有任何問題，但使用jQuery的問題就出現了。當我通過刷新重新加載頁面或導航回URL時，問題再次開始。我希望澄清這一點。乾杯! – Ryan