我有一个来自while循环。我用ajax处理它。它仅在第一个起作用而不在其他结果上起作用。请看看。
<?php while($a = $stmt->fetch()){ ?>
<form method="post" action="">
<input type="hidden" value="<?php echo $mbs_id; ?>" class="memid">
<select class="validity" class="upgrade-valsel">
<?php while($mv = $mval->fetch()){ extract($mv); ?>
<option value="<?php echo $mv_id; ?>"><?php echo $mv_validity; if($mv_validity == 1){ echo " month"; }else{ echo " months"; } ?></option>
<?php } ?>
</select>
<input type="submit" value="Upgrade" class="submit">
<div class="center-align" style="margin-left: -20px"><img src="images/loading.gif" width="auto" id="loading-rent" style="margin-right: 0px; height: 40px"></div>
</form>
<?php } ?>
当我点击第一个结果的提交按钮时,它会处理结果。但是当我点击其他按钮时,它只是刷新页面。我尝试用CLASS替换所有ID,但之后甚至没有第一个ID正在工作。请帮帮我。
脚本
$(document).ready(function() {
$(".submit").click(function() {
var dataString = {
memid: $(".memid").val(),
validity: $(".validity").val()
};
$.confirm({
title: 'Confirm!',
content: 'Are you sure you want to upgrade your membership to <?php echo $mbs_name; ?>?',
buttons: {
confirm: function () {
$.ajax({
type: "POST",
dataType : "json",
url: "upgrade-process.php",
data: dataString,
cache: true,
beforeSend: function(){
$("#submit").hide();
$("#loading-rent").show();
$(".message").hide();
},
success: function(json){
setTimeout(function(){
$(".message").html(json.status).fadeIn();
$("#submit").show();
$("#loading-rent").hide();
},1000);
}
});
},
cancel: function () {
$.alert('<span style="font-size: 23px">Upgrade Cancelled!</span>');
}
}
});
return false;
});
});
答案 0 :(得分:2)
当@Alive to Die和Jeff试图解释它时,你使用了返回多个对象的selector,所以当你在这组对象上使用一个函数时,jquery只使用这个集合的第一个对象。
你必须使用&#34;这个&#34;研究背景:
$(".submit").click(function(e) {
e.preventDefault();
// $(this) : your input with class .submit (the one you click)
// parent() : the parent of $(this) (the form)
// and then find the child with the unique class you want
var dataString = {
memid: $(this).parent().find(".memid").val(),
validity: $(this).parent().find(".validity").val()
};
// EDIT: Get the loading image (you should use a class instead of this selector)
var loader = $(this).parent().find("> div");
// After you can use loader in this function and all sub functions
loader.hide();
// And then the rest of your code with the same logic...
});
注意每个函数都有一个与其执行上下文链接的不同$(this)。
答案 1 :(得分:0)
单击preventDefault()
按钮时,使用submit
可防止页面刷新。使用this
获取当前表单的值。将您的dataString
更改为使用this
以获取当前表单的值。
$(document).ready(function() {
$(".submit").click(function(e) {
e.preventDefault();
var dataString = {
memid: $(this).parent().find(".memid").val(),
validity: $(this).parent().find(".validity").val()
};
$.confirm({
title: 'Confirm!',
content: 'Are you sure you want to upgrade your membership to <?php echo $mbs_name; ?>?',
buttons: {
confirm: function () {
$.ajax({
type: "POST",
dataType : "json",
url: "upgrade-process.php",
data: dataString,
cache: true,
beforeSend: function(){
$("#submit").hide();
$("#loading-rent").show();
$(".message").hide();
},
success: function(json){
setTimeout(function(){
$(".message").html(json.status).fadeIn();
$("#submit").show();
$("#loading-rent").hide();
},1000);
}
});
},
cancel: function () {
$.alert('<span style="font-size: 23px">Upgrade Cancelled!</span>');
}
}
});
return false;
});
});