我设法成功进行了ajax通话,但我现在想要的是排除'全选'复选框,因为我想如果我点击/检查它我正在进行另一个ajax调用。我猜这是因为当我检查它时,它会选择所有但是在一秒之后取消选择所有。
所以这是我的JS:
$(document).ready(function() {
function loadData(data){
$.ajax({
url: "item/item_processing.php",
type: "POST",
async: true,
data: data,
cache: false,
success: function(data) {
$('#results').html(data);
},
});
}
var first_page = "'page': 1";
loadData(first_page);
$('input, select', $('#filter_list')).on('keyup change',function() {
var page_num = $(this).attr('data-p');
var order_by = $("#filter_list input[type='radio']:checked").val();
var from_date = $('#from_date').val();
var to_date = $('#to_date').val();
var older_than = $('#older_than').val();
var claimed_uncl = $('#claimed_uncl').val();
var per_page = $('#per_page').val();
var key_word = $('#key_word').val();
var data = { 'page': page_num, 'from_date': from_date, 'to_date': to_date, 'older_than': older_than, 'claimed_uncl': claimed_uncl, 'per_page': per_page, 'key_word': key_word, 'order_by': order_by };
loadData(data);
});
$(document).on('click','#pagination .page_num', function(){
var page_num = $(this).attr('data-p');
var order_by = $("#filter_list input[type='radio']:checked").val();
var from_date = $('#from_date').val();
var to_date = $('#to_date').val();
var older_than = $('#older_than').val();
var claimed_uncl = $('#claimed_uncl').val();
var per_page = $('#per_page').val();
var key_word = $('#key_word').val();
var data = { 'page': page_num, 'from_date': from_date, 'to_date': to_date, 'older_than': older_than, 'claimed_uncl': claimed_uncl, 'per_page': per_page,'key_word': key_word, 'order_by': order_by };
loadData(data);
});
$(document).on('click','#sorting .sorting', function(){
var page_num = $(this).attr('data-p');
var order_by = $("#filter_list input[type='radio']:checked").val();
var from_date = $('#from_date').val();
var to_date = $('#to_date').val();
var older_than = $('#older_than').val();
var claimed_uncl = $('#claimed_uncl').val();
var per_page = $('#per_page').val();
var key_word = $('#key_word').val();
var data = { 'page': page_num, 'from_date': from_date, 'to_date': to_date, 'older_than': older_than, 'claimed_uncl': claimed_uncl, 'per_page': per_page,'key_word': key_word, 'order_by': order_by };
loadData(data);
});
});
和html:
<div class="item_table">
<ul id="sorting">
<li>
<div class="cust_row_5 sorting" style="width: 3%;"><input type="checkbox" name="selected1" class="selected1" value="" id="select_all" /></div>
<div class="cust_row_5 sorting">
<strong>ID</strong>
<label for="sort1" class="desc"><input type="radio" id="sort1" name="sort" class="sort_by" value="item_id desc" /></label>
<label for="sort2" class="asc"><input type="radio" id="sort2" name="sort" class="sort_by" value="item_id asc" /></label>
</div>
<div class="cust_row_40 sorting">
<strong>Description</strong>
<label for="sort3" class="desc"><input type="radio" id="sort3" name="sort" class="sort_by" value="description desc" /></label>
<label for="sort4" class="asc"><input type="radio" id="sort4" name="sort" class="sort_by" value="description asc" /></label>
</div>
<div class="cust_row_13 sorting">
<strong>Date/Time</strong>
<label for="sort5" class="desc"><input type="radio" id="sort5" name="sort" class="sort_by" value="date_found desc" /></label>
<label for="sort6" class="asc"><input type="radio" id="sort6" name="sort" class="sort_by" value="date_found asc" /></label>
</div>
<div class="cust_row_30 sorting">
<strong>Location Found</strong>
<label for="sort7" class="desc"><input type="radio" id="sort7" name="sort" class="sort_by" value="location_found desc" /></label>
<label for="sort8" class="asc"><input type="radio" id="sort8" name="sort" class="sort_by" value="location_found asc" /></label>
</div>
<div class="cust_row_10 sorting">
<strong>User</strong>
<label for="sort9" class="desc"><input type="radio" id="sort9" name="sort" class="sort_by" value="id desc" /></label>
<label for="sort10" class="asc"><input type="radio" id="sort10" name="sort" class="sort_by" value="id asc" /></label>
</div>
<div class="cust_row_10 sorting" style="border: none; width: 10%;">
<strong>Claimed</strong>
<label for="sort11" class="desc"><input type="radio" id="sort11" name="sort" class="sort_by" value="returned desc" /></label>
<label for="sort12" class="asc"><input type="radio" id="sort12" name="sort" class="sort_by" value="returned asc" /></label>
</div>
</li>
</ul>
</div>
谢谢!
答案 0 :(得分:0)
您可以为input
添加一个过滤器,因为您只想绑定单选按钮的事件,而不是input[type=radio]
,而不是复选框。
$('input[type=radio], select', $('#filter_list')).on('keyup change',function() {
var page_num = $(this).attr('data-p');
var order_by = $("#filter_list input[type='radio']:checked").val();
var from_date = $('#from_date').val();
var to_date = $('#to_date').val();
var older_than = $('#older_than').val();
var claimed_uncl = $('#claimed_uncl').val();
var per_page = $('#per_page').val();
var key_word = $('#key_word').val();
var data = { 'page': page_num, 'from_date': from_date, 'to_date': to_date, 'older_than': older_than, 'claimed_uncl': claimed_uncl, 'per_page': per_page, 'key_word': key_word, 'order_by': order_by };
loadData(data);
});
此外,您可以使用:not()
选择器排除类selected1
的复选框,请参阅下面的
$('input:not(.selected1), select', $('#filter_list')).on('keyup change',function() {...
}