我正在处理的网站的用户有一个电子邮件管理部分。 这会显示已发送，非活动和正在处理的电子邮件列表
有些选项可以选择特定的电子邮件并将其发送或使其处于非活动状态或处于活动状态。
我的问题是，如果用户没有选中勾选框，他们可以单击其中一个按钮，并运行此按钮的jquery / ajax，没有任何内容。
我想阻止这种情况发生，我不确定如何为多个复选框进行此操作。
我找到了一个解决方案，我想要1个复选框，而不是说，例如10。如果单击一个然后再单击一个，它将再次禁用该按钮
<div class='span8' style='padding-bottom:10px;margin-left:0px;'><label class='checkbox'><input title='Select All Sent Emails' type='checkbox' id='selectallsent'>Select All Sent</label> <label class='checkbox'><input title='Select All In Progress Emails' type='checkbox' id='selectallprogress'>Select All In Progress</label><br /><label class='checkbox'><input title='Select All Active Emails' type='checkbox' id='selectallactive'>Select All Active</label> <label class='checkbox'><input title='Select All Inactive Emails' type='checkbox' id='selectallinactive'>Select All In Inactive</label></div>
<div class='span4' style='padding-bottom:10px;text-align:right;margin-right:0px;vertical-align:top;'><br /><br /><input type="button" onclick="inactive()" class="btn btn-small setInactive" value="Set Inactive"> <input type="button" onclick="active()" class="btn btn-small setActive" value="Set Active"> <a href="#send_emails" type="button" onclick="sendResend()" role="button" data-toggle="modal" class="btn btn-small">Send / Resend</a></div></form>
<table id='reviewHistoryTable' class='table table-bordered table-striped'>
<thead>
<tr>
<th align='center' width='2%'></th>
<th align="center" width="10%">
Order Id
</th>
<th align="center" width="20%">
Customer Name
</th>
<th align="center" width="20%">
Customer Email
<th align="center" width="20%" >
Date Send
</th>
<th align='center' width='5%'>
Type
</th>
<th align="center" width="15%" >
Status
</th>
</tr>
</thead>
<tbody>
<?php foreach($histories as $row): ?>
<tr>
<td><input type='checkbox' name='<?=$row->service_feedback_email_id?>' class='<?=$row->email_sent?> <?=$row->status?>'></td>
<td ><?=$row->order_id?></td>
<td ><?=$row->customer_name?> </td>
<td ><?=$row->customer_email;?> </td>
<td><?=$row->date_send;?> </td>
<td><?=(!$row->review_type || $row->review_type=='store')?"Store":"Product"?></td>
<td>
<div id="editEmail_<?=$row->service_feedback_email_id?>" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="editEmailLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3>Edit Details</h3>
</div>
<div class="modal-body" style="height:900px;">
<form name="editEmail" id="<?=$row->service_feedback_email_id?>" method="post">
<input type="hidden" value="<?=$row->service_feedback_email_id?>" id="serviceFeedbackEmailId">
<label>Order ID</label><input id="orderId_<?=$row->service_feedback_email_id?>" type="text" value="<?=$row->order_id?>" disabled/>
<label>Customer Name</label><input id="customerName_<?=$row->service_feedback_email_id?>" class="customerName" name="customerName" type="text" value="<?=$row->customer_name?>"/>
<label>Customer Email</label><input id="customerEmail_<?=$row->service_feedback_email_id?>" type="text" value="<?=$row->customer_email?>"/>
<div class="input-prepend input-append">
<input name="from_date" type="text" class='datepicker' value='<?=$row->date_send;?>'>
<span class="add-on"><i class=' icon-calendar'></i></span>
</div><br/>
</form>
</div>
<div class="modal-footer">
<input type="button" onclick="update()" data-dismiss="modal" class="btn btn-small" value="Update">
<a href="#" class="btn" data-dismiss="modal" aria-hidden="true">Close</a>
</div>
</div>
</td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
<br/>
<div align='center'><?php echo($paging_link);?></div>
<!--<table>
<tr>
<td>
<div id="buttons">
<!-- <form action="<?=site_url()?>admin/csvexport/exportexitclick" method="post" target="_blank">
<input type="hidden" id="query" name="query" value="<?php //echo($query);?>" />
<input type="submit" value="Export CSV" name="export-submit" id="export-submit" class="button fr ">
<!--<a id="exportcsv" class="button fr " href="" target="_blank">Export CSV</a>
</form>
</div>
</td>
</tr>
</table>-->
<?php
}
?>
<div id="send_emails" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="sendEmailLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3>Send Emails</h3>
</div>
<div class="modal-body" style="height:40px;">
</div>
<div class="modal-footer">
<input type="button" onclick="send()" data-dismiss="modal" class="btn btn-small" value="Send New Emails Only">
<input type="button" onclick="resend()" data-dismiss="modal" class="btn btn-small" value="Resend Old Emails Only">
<input type="button" onclick="sendall()" data-dismiss="modal" class="btn btn-small" value="Send / Resend All Selected Emails">
<a href="#" class="btn" data-dismiss="modal" aria-hidden="true">Close</a>
</div>
</div>
</div>
<script>
$('span[data-toggle="tooltip"]').tooltip({
trigger: "hover",
placement: "right"
});
var selected = new Array();
function sendResend() {
var selected = Array();
var selectedSend = $(".no:checked").length;
var selectedResend = $(".yes:checked").length;
var totalSendResend = selectedSend + selectedResend;
$('input:checked').each(function () {
selected.push($(this).attr('name'));
});
if (totalSendResend < 1) {
$("#send_emails .modal-body").html('You have selected no emails. Please select some emails before proceeding.');
$("#send_emails .modal-body").css({
"height": "20px"
});
} else {
$("#send_emails .modal-body").html('You have selected ' + totalSendResend + ' emails. ' + selectedSend + ' New emails will be sent & ' + selectedResend + ' will be resent. Please confirm that you want to proceed?');
}
}
function send() {
ajaxEmailQuery($(".no:checked"));
}
function resend() {
ajaxEmailQuery($(".no:checked"));
}
function sendall() {
ajaxEmailQuery($(".yes:checked"));
}
function ajaxEmailQuery(data) {
var selected = Array();
data.each(function () {
selected.push($(this).attr('name'));
});
$.ajax({
url: "/b2b/ajaxEmailQuery",
type: "POST",
data: {
data: selected
},
success: function (data) {
alert(data);
loadFeedbackServiceHistory(1)
}
})
}
function inactive() {
var selected = Array();
$('input:checked').each(function () {
selected.push($(this).attr('name'));
});
var answer = confirm('Are you sure you want to set these emails as inactive?');
if (answer) {
$.ajax({
url: "/b2b/inactive",
type: "POST",
data: {
data: selected
},
success: function (data) {
alert(data);
loadFeedbackServiceHistory(1)
}
})
}
}
function active() {
var selected = Array();
$('input:checked').each(function () {
selected.push($(this).attr('name'));
});
var disabled = $(".setActive");
if(selected>0){
$disabled.removeProp("disabled");
}
var answer = confirm('Are you sure you want to set these emails as active?');
if (answer) {
$.ajax({
url: "/b2b/active",
type: "POST",
data: {
data: selected
},
success: function (data) {
alert(data);
loadFeedbackServiceHistory(1)
}
})
}
}
$(function () {
// add multiple select / deselect functionality
$("#selectallsent").click(function () {
$('.yes').prop('checked', this.checked);
});
$("#selectallprogress").click(function () {
$('.no').prop('checked', this.checked);
});
$("#selectallactive").click(function () {
$('.active').prop('checked', this.checked);
});
$("#selectallinactive").click(function () {
$('.inactive').prop('checked', this.checked);
});
// if all checkbox are selected, check the selectall checkbox
// and viceversa
$(".yes").click(function () {
if ($(".yes").length == $(".yes:checked").length) {
$("#selectallsent").prop("checked", "checked");
} else {
$("#selectallsent").removeAttr("checked");
}
});
$(".no").click(function () {
if ($(".no").length == $(".no:checked").length) {
$("#selectallprogress").prop("checked", "checked");
} else {
$("#selectallprogress").removeAttr("checked");
}
});
$(".active").click(function () {
if ($(".active").length == $(".active:checked").length) {
$("#selectallactive").prop("checked", "checked");
} else {
$("#selectallactive").removeAttr("checked");
}
});
$(".inactive").click(function () {
if ($(".inactive").length == $(".inactive:checked").length) {
$("#selectallinactive").prop("checked", "checked");
} else {
$("#selectallinactive").removeAttr("checked");
}
});
});
function update() {
var id = $("#serviceFeedbackEmailId").val();
var customerName = $("#customerName" + "_" + id).val();
var customerEmail = $("#customerEmail" + "_" + id).val();
var answer = confirm('Are you sure you want to update this email? Changes can not be reverted.');
if (answer) {
$.ajax({
type: "POST",
url: "/b2b/update",
data: {
id: id,
customerName: customerName,
customerEmail: customerEmail
},
success: function (data) {
alert(data);
loadFeedbackServiceHistory(1)
}
});
}
}
</script>
<!-- dashboard-content -->
答案 0 :(得分：3)
为每个电子邮件输入分配一个类emailInput。这可以用于使用JQuery .each()方法遍历所有复选框输入。
您可以使用return尽早摆脱.each()循环。 Reference
示例
$('#SendEmailsBtn' ).click(function () {
//Loop through checkbox inputs
$('.emailInput').each(function ( index, domEle) {
// domEle == this
//Check if input is checked
if ($(domEle).is(":checked"))
{
SubmitFunction();
return; //At least one input is checked exit loop
}
});
});
答案 1 :(得分：2)
您可以为每个复选框添加一个点击监听器，当点击一个框时，会启用“提交”按钮！
也许不是你想要的东西，但它能完成这项工作！
另一种选择是使用遍历所有复选框的循环。一旦遇到第一个检查框，您就可以停止循环并继续处理数据。
编辑：
伪代码：
for each (checkbox)
{
var checked = checkbox.checked();
if (checked)
{
submit();
exit();
}
}
答案 2 :(得分：2)
如果选中至少一个复选框，则调用submit函数，否则不执行任何操作。
$("#SendEmailBtn").click(function(){
if ($("input:checked").length != 0)
submit();
}