Javascript 单击事件上的重复数据和使用ajax提交表单
我有一个关于使用ajax发布后重复数据的问题。我有一些按钮没有id-only数据属性。我使用数据表库。单击之后，我使用表单调用一个模态。表单中有两个字段：输入文本和输入隐藏。 单击事件时，我将填充隐藏控件中的值。第一次提交后，一切正常。但在使用相同的模式进行第二次单击和第二次提交之后，我在控制台中有两个数据，如下所示：Javascript 单击事件上的重复数据和使用ajax提交表单,javascript,php,jquery,html,ajax,Javascript,Php,Jquery,Html,Ajax,我有一个关于使用ajax发布后重复数据的问题。我有一些按钮没有id-only数据属性。我使用数据表库。单击之后，我使用表单调用一个模态。表单中有两个字段：输入文本和输入隐藏。 单击事件时，我将填充隐藏控件中的值。第一次提交后，一切正常。但在使用相同的模式进行第二次单击和第二次提交之后，我在控制台中有两个数据，如下所示： Object {isSuccess: true, carId: 13550, message: "Post success"} Object {isSuccess: true,
Object {isSuccess: true, carId: 13550, message: "Post success"}
Object {isSuccess: true, carId: 13550, message: "Post success"}
<table id="carsInventory">
<tr>
<td>
<button type="button" data-toggle="modal" data-target="#inv-bid-modal" data-car-id="13551" data-car-brand="MAZDA" data-car-model="Mazda6" class="btn btn-large btn-bids">Bid</button>
<td>
</tr>
<tr>
<td>
<button type="button" data-toggle="modal" data-target="#inv-bid-modal" data-car-id="13550" data-car-brand="CADILLAC" data-car-model="CTS" class="btn btn-large btn-bids">Bid</button>
<td>
</tr>
</table>
<div class="modal fade" id="inv-bid-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-toggle="bidModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title"></h4>
</div>
<form id="inv-bid-form" method="post">
<div class="modal-body">
<p class="intro-bid">
Your Maximum Bid:
</p>
<div class="input-group">
<span class="input-group-addon">$ </span>
<input id="userBid" type="text" value="" class="form-control" name="userBid" required pattern="\d+(\.\d{2})?">
<span class="input-group-addon">.00</span>
</div>
<i class="intro-bid">
($100 USD Bid Increments)
</i>
<input id="invCarId" type="hidden" value="" name="invCarId" />
</div>
<div class="modal-footer">
<button type="button" class="btn btn-danger" data-dismiss="modal">Cancel</button>
<input type="submit" class="btn btn-bid" value="Bid Now">
</div>
</form>
</div>
</div>
</div>
提前感谢。我找到的解决方案是：
function submitBidForm(data, id)
{
var bidForm = $("#inv-bid-form"),
bidModal = $("#inv-bid-modal"),
objectBtn = $(data.target),
carId = id,
bidField = $('#userBid'),
carIdField = $('#invCarId');;
carIdField.val(carId);
var status = true; // Set default status
bidForm.submit(function(event)
{
event && event.preventDefault();
var that = $(this),
bid = bidField.val();
if( bid == undefined || parseInt(bid) < 100 )
{
setBsMessages('warning', 'Incorect increment!');
bidField.val('');
carIdField.val('');
return false;
}
if(status) {
status = false; // Set status false to preventing second post
var request = $.ajax({
url : '/car/rest/setBid/',
method : 'POST',
dataType : 'json',
cache : 'false',
data : that.serialize(),
success : function(result,textStatus, jqXHR)
{
if(result.isSuccess)
{
bidModal.modal('hide').fadeOut('fast');
objectBtn.attr('disabled',true);
bidField.val('');
carIdField.val('');
bidForm.reset();
var status = true; // Status true if post pass
return false;
}else{
bidModal.modal('hide').fadeOut('fast');
bidField.val('');
carIdField.val('');
setBsMessages('error', 'Invalid bid!');
}
},
error: function (result, textStatus, errorThrown) {
bidModal.modal('hide').fadeOut('fast');
bidField.val('');
carIdField.val('');
setBsMessages('error', 'Error! ' + result);
}
});
return false;
}
});
}
函数submitBidForm（数据，id）
{
var bidForm=$（“#投资投标表格”），
bidModal=$（“#投资-投标模式”），
objectBtn=$（data.target），
carId=id，
bidField=$（'#userBid'），
carIdField=$（“#invCarId”）；；
carIdField.val（carId）；
var status=true；//设置默认状态
提交（功能（事件）
{
event&&event.preventDefault（）；
var that=$（此），
bid=bidField.val（）；
if（bid==未定义的| | parseInt（bid）<100）
{
setBsMessages（'warning'，'increct increment！'）；
bidField.val（“”）；
卡尔菲尔德山谷（“”）；
返回false；
}
如果（状态）{
status=false；//将status false设置为防止第二次发布
var请求=$.ajax({
url:“/car/rest/setpid/”，
方法：“POST”，
数据类型：“json”，
缓存：“false”，
data:that.serialize（），
成功：函数（结果、文本状态、jqXHR）
{
如果（结果。发布成功）
{
bidModal.modal（'hide'）.fadeOut（'fast'）；
objectBtn.attr（'disabled'，true）；
bidField.val（“”）；
卡尔菲尔德山谷（“”）；
bidForm.reset（）；
var status=true；//如果post pass，则状态为true
返回false；
}否则{
bidModal.modal（'hide'）.fadeOut（'fast'）；
bidField.val（“”）；
卡尔菲尔德山谷（“”）；
setBsMessages（'error'，'Invalid bid！'）；
}
},
错误：函数（结果、文本状态、错误抛出）{
bidModal.modal（'hide'）.fadeOut（'fast'）；
bidField.val（“”）；
卡尔菲尔德山谷（“”）；
setBsMessages（'error'，'error！'+结果）；
}
});
返回false；
}
});
}
public function setBid() {
header('Content-type: text/json');
header('Content-type: application/json');
$result = false;
if ( $_POST['invCarId'] ) {
$this->load->model('bid');
$bidModel = new bid();
$carId = (int) $_POST['invCarId'];
$bidValue = (int) $_POST['userBid'];
if ( $bidModel->isExistBid($carId))
{
$data = [
'isSuccess' => 'exist',
'carId' => $carId,
'message' => 'Bid exist'
];
echo json_decode($data);
exit;
}
if ( $bidModel->addBid( $carId, $this->current_user->id, $bidValue ) ) {
$result = true;
} else {
$result = false;
}
$data = [
'isSuccess' => (bool) $result,
'carId' => $carId,
'message' => 'Post success'
];
echo json_encode($data);
exit;
} else {
echo json_decode($result);
exit;
}
}
function submitBidForm(data, id)
{
var bidForm = $("#inv-bid-form"),
bidModal = $("#inv-bid-modal"),
objectBtn = $(data.target),
carId = id,
bidField = $('#userBid'),
carIdField = $('#invCarId');;
carIdField.val(carId);
var status = true; // Set default status
bidForm.submit(function(event)
{
event && event.preventDefault();
var that = $(this),
bid = bidField.val();
if( bid == undefined || parseInt(bid) < 100 )
{
setBsMessages('warning', 'Incorect increment!');
bidField.val('');
carIdField.val('');
return false;
}
if(status) {
status = false; // Set status false to preventing second post
var request = $.ajax({
url : '/car/rest/setBid/',
method : 'POST',
dataType : 'json',
cache : 'false',
data : that.serialize(),
success : function(result,textStatus, jqXHR)
{
if(result.isSuccess)
{
bidModal.modal('hide').fadeOut('fast');
objectBtn.attr('disabled',true);
bidField.val('');
carIdField.val('');
bidForm.reset();
var status = true; // Status true if post pass
return false;
}else{
bidModal.modal('hide').fadeOut('fast');
bidField.val('');
carIdField.val('');
setBsMessages('error', 'Invalid bid!');
}
},
error: function (result, textStatus, errorThrown) {
bidModal.modal('hide').fadeOut('fast');
bidField.val('');
carIdField.val('');
setBsMessages('error', 'Error! ' + result);
}
});
return false;
}
});
}