使用Jquery和Ajax选中复选框后过滤数据
这是search.php
<li>
<div class="collapsible-header"><i class="material-icons">library_books</i>Courses</div>
<div class="collapsible-body">
<form class="form-horizontal well" action="<?php echo base_url();?>search" method="post" role="form">
<span>
<?php foreach($coursedata as $val){
?>
<p>
<input class="with-gap filter_course CheckCourse" name="course_offrd_name[]"
multiple type="checkbox" id="<?php echo $val->course_offrd_name; ?>"
value="<?php
echo $val->course_offrd_name;?>"
<?php
if(!empty($courserecord))
if(count($courserecord)==1)
if($courserecord[0]['course_offrd_name']==$val->course_offrd_name) {
echo $courserecord[0]['course_offrd_name'];
echo "checked";
}
else {
}?>/>
<label for="<?php echo $val->course_offrd_name?>"></label>
</p>
<?php } ?>
</span>
<br>
</form>
</div>
</li>
<div class="col m9 s12" id="college_data">
<main>
<!-- card open -->
<?php foreach ($record as $res) {?>
<div class="col s12 m6 l4 ">
<div class="card sticky-action hoverable wow bounce">
<div class="card-image waves-block ">
<a href="<?php echo base_url();?>college_details/<?php echo $res->collg_id;?>">
<div class="header-container">
<?php if (isset($res->header_img) && !empty($res->header_img)) { ?>
<img class="activator" src="<?php echo base_url();?>uploads/college_header/<?php echo $res->header_img;?>">
<?php } else {?>
<img class="activator" src="<?php echo base_url();?>uploads/header_img.png" alt="<?php echo $res->collg_name; ?>">
<?php } ?>
</div>
</a>
<!-- <img class="activator" src="<?php// echo base_url();?>uploads/<?php// echo $d->header_img;?>">-->
</div>
<div class="card-content">
<?php if (isset($res->logo_img) && !empty($res->logo_img)) { ?>
<a href="<?php echo base_url();?>college_details/<?php echo $res->collg_id;?>"><img class="colleg_logo hoverable circle" src="<?php echo base_url();?>uploads/college_logo/<?php echo $res->logo_img; ?>" alt="<?php echo $res->collg_name; ?>"></a>
<?php } else {?>
<a href="<?php echo base_url();?>college_details/<?php echo $res->collg_id;?>"><img class="colleg_logo hoverable circle" src="<?php echo base_url();?>uploads/default_logo.png" alt="<?php echo $res->collg_name; ?>"></a>
<?php } ?>
<a href="<?php echo base_url();?>college_details/<?php echo $res->collg_id;?>"<span class="card-title activator grey-text text-darken-4 truncate" style="font-size:16px; font-weight: bold;"><?php echo $res->collg_name;?></span></a>
<p><a href="<?php echo base_url();?>college_details/<?php echo $res->collg_id;?>" class="chip hoverable">About-College</a>
<!-- <a href="<?php echo base_url();?>home/college_details/<?php echo $res->collg_id;?>" class="chip hoverable"> Placement</a> -->
<a href="<?php echo base_url();?>college_details/<?php echo $res->collg_id;?>" class="chip hoverable"> Course</a>
<!-- <a href="<?php echo base_url();?>home/college_details/<?php echo $res->collg_id;?>" class="chip hoverable"> Exam</a> -->
<!-- <a href="<?php echo base_url();?>home/college_details/<?php echo $res->collg_id;?>" class="chip hoverable">Book seat</a>
<a href="<?php echo base_url();?>home/college_details/<?php echo $res->collg_id;?>" class="chip hoverable">Gallery</a> -->
</p><br>
<p class="center-align">
<a class="waves-effect waves-light btn modal-trigger hoverable " href="<?php echo base_url();?>college_request/<?php echo $res->collg_id;?>">
<i class="material-icons left">check</i>Get Details</a>
<!-- <a class="waves-effect waves-light btn orange modal-trigger" href="<?php echo base_url();?>home/college_request"></a> -->
</p> <br>
<p class="center-align">
<p class="center-align">
<a class="waves-effect waves-light btn modal-trigger hoverable" href="<?php echo base_url();?>broucher_request/<?php echo $res->collg_id;?>">
<i class="material-icons left">arrow_downward</i>Brochure</a>
<!-- <a class="waves-effect waves-light btn orange modal-trigger" href="#modal1">Modal</a>-->
</p>
</p>
</div>
</div>
<!-- card close -->
</div>
<!-- <a class="btn-floating btn-large waves-effect waves-light red"><i class="material-icons">add</i></a> -->
<?php } ?>
<?php if($this->session->userdata("user_login")){?>
<div class="back_button ">
<a href="<?php echo base_url();?>"class="btn-floating btn-large hoverable"><i class="material-icons">arrow_back</i></a>
</div>
<?php } else {?>
<div class="back_button ">
<a href="<?php echo base_url();?>"class="btn-floating btn-large hoverable"><i class="material-icons">arrow_back</i></a>
</div>
<?php } ?>
<?php if($this->session->userdata("user_login")){
// print_r($_SESSION);die;
?>
<div class="fixed-action-btn verticle ">
<a class="btn-floating btn-large tooltipped pulse wow zoomIn" data-position="left" data-delay="50" data-tooltip="Settings">
<i class="large material-icons">settings</i>
</a>
<ul>
<li><a href="<?php echo base_url();?>logout" class="btn-floating tooltipped" data-position="left" data-delay="50" data-tooltip="logout"><i class="material-icons" >logout</i></a></li>
<li><a href="<?php echo base_url();?>change-password/<?php echo $array['id']?>" class="btn-floating tooltipped" data-position="left" data-delay="50" data-tooltip="Change password"><i class="material-icons" >lock_open</i></a></li>
<?php
if($_SESSION['user_role']=='student'){ ?>
<li><a href="<?php echo base_url();?>student_panel/<?php echo $record1[0]->reg_id;?>" class="btn-floating"><i class="material-icons">list</i></a></li>
<?php }
elseif($_SESSION['user_role']=='superadmin'){ ?>
<li><a href="<?php echo base_url();?>admin_panel" class="btn-floating tooltipped" data-position="left" data-delay="50" data-tooltip="Admin panel"><i class="material-icons">list</i></a></li>
<?php }
elseif ($_SESSION['user_role']=='college') { ?>
<li><a href="<?php echo base_url();?>college_panel/<?php echo $record2[0]->collg_id;?>" class="btn-floating "><i class="material-icons">list</i></a></li>
<?php }
elseif ($_SESSION['user_role']=='dataentry') { ?>
<li><a href="<?php echo base_url();?>admin_panel" class="btn-floating"><i class="material-icons">list</i></a></li>
<?php }
else{ ?>
<li><a href="<?php echo base_url();?>" class="btn-floating"><i class="material-icons">list</i></a></li>
<?php }
?>
</ul>
</div>
<?php } ?>
<div class="col m9 s12" id="filter_data">
</div>
<script type="text/javascript">
$(".filter_course").click(function(){
// alert();
$("#college_data").html('');
$("#filter_data").html('');
var check_course =[];
$.each($('.CheckCourse:checked'), function() {
check_course.push($(this).val());
});
alert(check_course);
$.ajax({
alert('hello');
url:js_base_url+"home/check_course",
dataType: 'JSON',
type: 'POST',
data:{check_course:check_course},
success: function(response){
var len = response.length;
//alert(len);
for(var i=0; i<len; i++){
var collg_name = response[i].collg_name;
var header_img=response[i].header_img;
//alert(header_img);
var logo_img=response[i].logo_img;
if(header_img!=""){
var college_header_img='<img class="activator" src="<?php echo base_url();?>uploads/college_header/'+header_img+'">';
}
else{
var college_header_img='<img class="activator" src="<?php echo base_url();?>uploads/header_img.png" alt="">';}
if(logo_img!=""){
var college_logo_img='<a href=""><img class="colleg_logo hoverable circle" src="<?php echo base_url();?>uploads/college_logo/'+logo_img+'" alt=""></a>';
}
else{
var college_logo_img='<a href=""><img class="colleg_logo hoverable circle" src="<?php echo base_url();?>uploads/default_logo.png" alt=""></a>';
}
//var tr_str='<div class="col s12 m6 l4"><div class="card sticky-action hoverable wow bounce"><div class="card-content"><div class="card-image waves-block "><a href=""><div class="header-container">'+college_header_img+'</div> </a></div>'+college_logo_img+'<a href="#"'+'<span class="card-title activator grey-text text-darken-4 truncate" style="font-size:16px; font-weight: bold;">'+collg_name+'</span></a>'+'<p><a href="#" class="chip hoverable">About-College</a><a href="<?php echo base_url();?>home/college_details/<?php echo $res->collg_id;?>" class="chip hoverable"> Course</a></p><br><br><p class="center-align"><p class="center-align"></p></p></div></div></div><div class="back_button"><a href="<?php echo base_url();?>" class="btn-floating btn-large hoverable "><i class="material-icons">arrow_back</i></a></div>';
var tr_str='<div class="col s12 m6 l4"><div class="card sticky-action hoverable wow bounce"><div class="card-content"><div class="card-image waves-block "><a href=""><div class="header-container">'+college_header_img+'</div> </a></div>'+college_logo_img+'<a href="#"'+'<span class="card-title activator grey-text text-darken-4 truncate" style="font-size:16px; font-weight: bold;">'+collg_name+'</span></a>'+'<p><a href="#" class="chip hoverable">About-College</a><a href="<?php echo base_url();?>home/college_details/<?php echo $res->collg_id;?>" class="chip hoverable"> Course</a></p><br><p class="center-align"><a class="waves-effect waves-light btn modal-trigger hoverable " href="<?php echo base_url();?>home/college_request"><i class="material-icons left">check</i>Get Details</a></p> <br><p class="center-align"><p class="center-align"><a class="waves-effect waves-light btn modal-trigger hoverable" href="<?php echo base_url();?>home/broucher_request"><i class="material-icons left">arrow_downward</i>Brochure</a></p> </p><br><p class="center-align"><p class="center-align"></p></p></div></div></div><div class="back_button "><a href="<?php echo base_url();?>" class="btn-floating btn-large hoverable"><i class="material-icons">arrow_back</i></a></div>';
$("#filter_data").append(tr_str);
}
}
});
});
});
</script>
这是controller.php
function check_course(){
$check_course = implode(' , ',$this->input->post('check_course'));
$collegecoursedata = $this->front->query('SELECT * FROM tbl_college where course_name in('.$check_course.')','result_array');
$data['collegecoursedata'] = json_decode(json_encode($collegecoursedata),True);
echo json_encode($data['collegecoursedata']);
}
这是模型
function query($sql,$rowResult)
{
return $this->db->query($sql)->$rowResult();
}
除控制器和模型外，所有代码（jQuery，ajax）均位于同一页面中。 我正在尝试过滤数据，即我有两个复选框，一个是医学课程，第二个是工程学。如果我选中医学课程，则它应该过滤学院名称，学院ID，即它像一张具有所有详细信息的卡片形状数据。例如，如果两所大学开设了医学课程，则应显示两张卡片，并且工程学上也要显示相同的卡片。 当我使用alert（'hello'）;在$ .ajax中，它没有给我警报电话。 为什么不调用alert（'hello'）函数，如果调用了alert，那么数据是否在过滤？ 数据如何过滤，我的数据以jQuery的json形式出现？ 如果需要更多代码将有所帮助。 如何解决这类问题？ 为什么不调用alert（'hello'）函数，如果调用了alert，那么数据是否在过滤？ 数据如何过滤，我的数据如何通过jQuery以json的形式出现？