我在一个表格中列出了所有用户。最后一个 td 元素将包含一个表单,用于开立帐户的表单或用于关闭帐户的表单,具体取决于用户是否已关闭。我正在使用 http://malsup.com/jquery/form/的jQuery AJAX表单插件,它正在工作。我想做的是在提交表单之前更改按钮的值。
这是我现在的JS:
$(document).ready(function() {
$('form').ajaxForm({
beforeSubmit: function() {
$('form').find('input').val('Wait...');
},
success: function(data) {
$('body').html(data);
}
});
return false;
});
这是我的 HTML 标记:
<td>
<?php if($user['closed'] == 0):?>
<?php $attributes = ['class' => 'account']; ?>
<?php echo form_open('admin/closeAccount', $attributes);?>
<input type="hidden" name="user_id" value="<?=$user['user_id']?>"/>
<input type="hidden" name="user_email" value="<?=$user['email']?>"/>
<input type="submit" name="close_account" class="btn btn-danger btn-sm" id="trigger" value="Close" >
<?php echo form_close();?>
<?php else:?>
<?php $attributes = ['class' => 'account'];?>
<?php echo form_open('admin/openAccount');?>
<input type="hidden" name="user_id" value="<?=$user['user_id']?>"/>
<input type="submit" data-loading-text="Odota..." name="open_account" class="btn btn-success btn-sm" id="trigger" value="Open" >
<?php echo form_close();?>
<?php endif ?>
</td>
问题是,每次我尝试提交表单时,它现在都会将所有按钮的值更改为"等待..."而不仅仅是我点击的那个。我试过了在$('form').find('input').val('Wait...');
用$(this)
替换$('form')
,但这对我根本没有帮助。
根据插件文档 (http://malsup.com/jquery/form/#options-object(传递给 beforeSubmit 回调$form应允许您访问正在提交的当前表单。
尝试:
$('form').ajaxForm({
beforeSubmit: function(arr, $form, options) {
$form.find('.btn').val('Wait...');
},
success: function(data) {
$('body').html(data);
}
});
试试这段代码
$('.btn'(.val('Wait...'(;
或
$('.btn-danger'(.val('Wait...'(;
或
$('.btn-sm'(.val('Wait...'(;
尝试为您的 CSS 选择器添加更多特异性。 在你的 ajaxForm(( 调用中尝试这个来更改提交按钮值:
$(this).find('input[type="submit"]').val('Wait...');
如果我理解正确,您只需将选择器更改为 - $('input[type="submit"]'(。所以它会是—— $('form').find('input[type="submit"]').val('Wait...');
或使用:提交选择器
你的按钮有一个id,你为什么不使用该选择器?
$("#trigger").val("Wait...");
表单本身是否通过 ajax 加载? 如果是这样,则委派。
$(document).on("customevent", "#trigger", function() {
$(this).val("Wait...");
});
然后在之前提交 $(document(.trigger("customevent"(;