How to create custom filter option box in datatables, Codeigniter 4 in php 8.2 ||
DataTables AJAX pagination with Custom filter in CodeIgniter 4 || codewithtanveer
In this tutorial we will discuss that how to create custom filter in datatable in codeigniter4
HTML
<input type="hidden" class="txt_csrfname" name="<?= csrf_token() ?>"
value="<?= csrf_hash() ?>" />
<div class="col-md-12 col-sm-12 col-lg-12 col-xs-12">
<div class="col-md-3 col-sm-3 col-lg-3 col-xs-12">
<label for="inputName5" class="form-label">Product</label>
<select class="form-control" name="smp_product" id="Filter_product"
data-live-search="true">
<option value="0">All</option>
<option value="1">Carpet</option>
<option value="2">POUF</option>
<option value="3">CUSHION</option>
</select>
</div>
<div class="col-md-3 col-sm-3 col-lg-3 col-xs-12">
<label for="inputName5" class="form-label">Sort By</label>
<select class="form-control" name="re_order" id="Filter_ASCDESC"
data-live-search="true">
<option value="0">None</option>
<option value="1">ASC</option>
<option value="2">DESC</option>
</select>
</div>
</div>
<div style="clear:both;"><br></div>
<div class="col-md-12 col-sm-12 col-lg-12 col-xs-12">
<div class="table-responsive" style="padding-left:0; padding-right:0">
<table class="table table-hover table-striped table-data datatable"
id="Tableleististtable">
<thead>
<tr>
<th>SN.</th>
<th>Image</th>
<th>Construction</th>
<th>Design</th>
<th>Color</th>
<th>Size</th>
<th>Action</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
JavaScript
$(document).ready(function(){
var mybase_path=document.getElementById('mybase_path').value;
var empTable = $('#Tableleististtable').DataTable({
'processing': true,
'serverSide': true,
"order": [[0, "desc" ]], //Initial no order.
'serverMethod': 'post',
"iDisplayLength" : 100,
'ajax': {
'url':mybase_path + "/allsamplelist",
'data': function(data){
var csrfName = $('.txt_csrfname').attr('name'); // CSRF Token name
var csrfHash = $('.txt_csrfname').val(); // CSRF hash
var p_id = $('#Filter_product').val();
data.searchProduct = p_id;
var asc_desc = $('#Filter_ASCDESC').val();
data.asc_desc = asc_desc;
return {
data: data,
[csrfName]: csrfHash // CSRF Token
};
},
dataSrc: function(data){
$('.txt_csrfname').val(data.token);
return data.aaData;
}
},
'columns': [
{ data: 'rowid' },
{ data: 'row1' },
{ data: 'row2' },
{ data: 'row3' },
{ data: 'row4' },
{ data: 'row5' },
{ data: 'action' },
]
});
$('#Filter_product').change(function(){
empTable.draw();
});
$('#Filter_ASCDESC').change(function(){
empTable.draw();
});
});
Controller
public function allsamplelist(){
$model = new Product_model();
$request = service('request');
$postData = $request->getPost();
$dtpostData = $postData['data'];
$response = array();
## Read value
$draw = $dtpostData['draw'];
$start = $dtpostData['start'];
$rowperpage = $dtpostData['length']; // Rows display per page
$columnIndex = $dtpostData['order'][0]['column']; // Column index
$columnName = $dtpostData['columns'][$columnIndex]['data']; // Column name
$columnSortOrder = $dtpostData['order'][0]['dir']; // asc or desc
$searchValue = $dtpostData['search']['value']; // Search value
$searchProduct = $dtpostData['searchProduct'];
$asc_desc = $dtpostData['asc_desc'];
## Total number of records without filtering
$totalRecords = $model->countall();
## Total number of records with filtering
$totalRecordwithFilter = $model->recordFilter($searchValue,$searchProduct);
$records = $model->datatablerecords($searchValue,$columnName,$columnSortOrder,$rowperpage
,$start,$searchProduct,$asc_desc);
$data = array();
$sn=1;
foreach($records as $record ){
$edit= '';
}
$data[] = array(
"smp_id"=>$sn,
"row1"=>'<a href="'.base_url().'/asset/upload/thumbnail/'.$record['smp_main_thumbnail'].'"
class="nsbbox">'.$img.'</a>',
"row2"=>$record['qt_name'],
"row3"=>$record['smp_design'],
"row4"=>$record['clr_name'],
"row5"=>$record['mt_size'],
"action"=>$edit,
);
$sn++;
}
## Response
$response = array(
"draw" => intval($draw),
"iTotalRecords" => $totalRecords,
"iTotalDisplayRecords" => $totalRecordwithFilter,
"aaData" => $data,
"token" => csrf_hash() // New token hash
);
return $this->response->setJSON($response);
}
Modal
<?php
namespace App\Models;
use CodeIgniter\Model;
class Product_model extends Model{
protected $table = 'Product';
protected $primaryKey = 'p_id';
protected $useAutoIncrement = true;
protected $insertID = 0;
protected $returnType = 'array';
protected $useSoftDeletes = false;
protected $protectFields = true;
protected $allowedFields = ['p_id','p_product'];
public function datatablerecords($searchValue="",$columnName="",$columnSortOrder=""
,$rowperpage="",$start="",$id="",$asc_desc="") {
$builder = $this->builder('Product');
$builder->select('*');
if(!empty($id)){
$builder->orLike('p_product', $id);
}
if(!empty($asc_desc)){
if($asc_desc=='1'){
$builder->orderBy('p_product','ASC');
}
if($asc_desc=='2'){
$builder->orderBy('p_product','DESC');
}
}else{
$builder->orderBy($columnName,$columnSortOrder);
}
$builder->limit($rowperpage, $start);
$query = $builder->get();
$result = $query->getResultArray(); //print $this->db->getLastQuery();
return $result;
}
public function countall(){
$builder = $this->builder('Product');
$builder->select('p_id');
$q = $builder->get();
return $q->getNumRows();
}
public function recordFilter($searchValue="",$id=""){
$builder = $this->builder('Product');
if(!empty($id)){
$builder->orLike('p_product', $id);
}
$q = $builder->get();
return $q->getNumRows();
}
}
0 Comments