If you want to implement add bulk action like Export CSV , Removing all , single records , Export seleted records to excel and adding
filters like days filter to data tables listings using ajax approch
1. You need to include required jQuery for datatables , ajax processing.
<script src="<?php echo base_url(); ?>assets/js/jquery-1.11.0.min.js"></script>
<script src="<?php echo base_url(); ?>assets/js/jquery.dataTables.min.js"></script>
<script src="<?php echo base_url(); ?>assets/js/dataTables.bootstrap.js"></script>
<script src="<?php echo base_url();?>assets/js/datatables/responsive/js/datatables.responsive.js">
</script>
<script src="<?php echo base_url(); ?>assets/js/datatables/jquery.dataTables.columnFilter.js">
</script>
2. Your html source file or you can say your view file will goes like below.
<h3 class="page-title">Accounts</h3>
<div class="panel panel-primary" data-collapsed="0">
<div class="col-sm-12">
<div class="panel-body">
<form id="Gexcel" name="Gexcel" method="POST" action="<?php echo base_url(); ?
>accounts/create_document">
<input type="hidden" name="aidds" id="aidds" ><input type="hidden" name="atype" id="atype" value="da" >
</form>
<table id="demo_account_listing" class="display" cellspacing="0" width="100%">
<thead>
<tr>
<th class="no-sort"></th>
<th class="trigger_reload">Sr No</th>
<th>ID</th>
<th>Date</th>
<th class="no-sort">Days Left</th>
<th>Name</th>
<th>Email Address</th>
<th>Country</th>
<th>Phone</th>
<th>Mobile</th>
<th>Photo</th>
<th>Source</th>
<th class="no-sort"> Action</th>
</tr>
</thead>
</table>
</div>
</div>
</div>
<script type="text/javascript">
jQuery(window).load(function () {
var $ = jQuery;
var oAllLinksTable = $("#demo_account_listing").dataTable({
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": baseurl + 'accounts/get_account_listing',
"sPaginationType": "bootstrap",
"oLanguage": {
"sEmptyTable": "No account found.",
"sProcessing": "<img src='<?php echo base_url(); ?>/assets/global/img/loading-spinner-blue.gif'>"
},
"columnDefs": [{
"targets": 'no-sort',
"orderable": false
}],
"aoColumnDefs": [{"bVisible": true, "aTargets": [0]}],
"order": [[0, "desc"]],
processing: true,
"fnServerParams": function (aoData) {
var last_days = $('input[name=days_filter]:checked').val();
aoData.push({name: "days_filter", value: last_days});
},
"fnRowCallback": function (nRow, aData, iDisplayIndex) {
var oSettings = oAllLinksTable.fnSettings();
$("td:nth-child(2)", nRow).html(oSettings._iDisplayStart + iDisplayIndex + 1);
$(nRow).attr("id", 'tr_' + aData[0]);
$("td:nth-child(1)", nRow).html("
<input type='checkbox' name='contacts[]' class='mail-checkbox check_' value='" + aData[0] + "'>");
return nRow;
}
});
var action_radio = '<div class="pull-right check_filter" id="filter_group_radio"><span>
<input type="radio" name="days_filter" id="dsv" class="form-control days_filter" value="7">
Last7 Days</span> <span>
<input type="radio" id="df" name="days_filter" class="form-control days_filter" value="14">
Last 14 Days </span><span>
<input type="radio" id="dthi" name="days_filter" class="form-control days_filter" value="30">
Last 30 Days </span><span>
<input type="radio" id="dsx" name="days_filter" class="form-control days_filter" value="60">
Last 60 Days</span></div>';
var extra_action = action_radio + '<div class="pull-right">
<a href="<?php echo base_url(); ?>accounts/new_account">
<button class="btn purple-plum pull-right" type="button">Open New Demo Account</button>
</a> </div>';
$custome_search_filter = extra_action + ' <span class="btn blue" style="height:34px;">
<input type="checkbox" class="checkallbox" id="select_all_"></span><div class="pull-right">
<div class="btn-group myremove"><button data-toggle="dropdown"
class="btn blue dropdown-toggle dropup" aria-expanded="false">
Bulk Action<i class="fa fa-angle-down"></i></button><ul role="menu"
class="dropdown-menu pull-right">
<li role="presentation"><a data-toggle="modal" class="deleteRecord"
href="" tabindex="-1" role="menuitem">
Delete</a></li><li role="presentation">
<a data-toggle="modal" class="exportExcel" href="" tabindex="-1"
role="menuitem">Export to excel</a></li></ul></div></div>';
$($custome_search_filter).appendTo("#demo_account_listing_length > label");
$("#demo_account_listing_length").parent().removeClass('col-md-6').addClass('col-md-10');
$("#demo_account_listing_filter").parent().removeClass('col-md-6').removeClass('col-sm-12');
$(function () {
$(document).on('change', '.days_filter', function (event) {
event.preventDefault();
oAllLinksTable.fnFilter(this.value, 12);
$(this).find('#filter_group_radio input:radio').prop('checked', true);
});
});
$(document).on('click', '.checkallbox', function () {
if ($('#select_all_').is(':checked')) {
$(".check_").prop("checked", "checked");
} else {
$(".check_").removeAttr('checked');
}
});
$(document).on('click', '.check_', function () {
var $this = $(this);
// $this will contain a reference to the checkbox
var numberOfChecked = $('.check_:checked').length;
var totalCheckboxes = $('.check_').length;
var numberNotChecked = totalCheckboxes - numberOfChecked;
if (numberOfChecked == totalCheckboxes) {
$('#select_all_').prop('checked', 'checked');
}
else {
$('#select_all_').removeAttr('checked');
}
});
$(document).on('click', '.deleteRecord', function (e) {
e.preventDefault();
var allVals = [];
$('.check_').each(function () {
if ($(this).is(':checked')) {
allVals.push($(this).val());
}
});
if ($('.check_').is(':checked')) {
bootbox.confirm("Are you sure you want to delete?", function (result) {
if (result == true) {
$.ajax({
url: baseurl + 'accounts/removeAccounts?time=' + timestamp,
type: 'post',
data: 'atype=la&rids=' + allVals,
dataType: 'json',
success: function (response) {
$("#showmessage_jscbf").html("");
switch (response.Mstatus) {
case 'success':
$.each(response.idds.split(','), function () {
$("#tr_" + this).hide();
});
$(".trigger_reload").trigger('click');
break;
case 'error':
$("#showmessage_jscbf").html(response.msg);
break;
}
}
});
}
});
return false;
} else {
alert("Please select one record to delete.")
}
});
$(document).on('click', '.exportExcel', function (e) {
e.preventDefault();
var allVals = [];
$('.check_').each(function () {
if ($(this).is(':checked')) {
allVals.push($(this).val());
}
});
if ($('.check_').is(':checked')) {
$("#aidds").val(allVals);
document.Gexcel.submit();
} else {
alert("Please select one records to export.")
}
});
});
$(function () {
$(document).on('click', '.removeRcords', function (event) {
event.preventDefault();
var idss = $(this).attr('id');
var rid = idss.split("_")[1];
do_remove_ajax('account_type_remove', rid);
});
});
</script>
Notes:
I. Gexcel is a form where all selected ids will be store in hidden id aidds textbox.
II. demo_account_listing_length , you can just open your firebug and can get your id from there.you can see in above html that my id is demo_account_listing so datatable attaching his event to this id.
III. action_radio , $custome_search_filter , extra_action is the filter html , we have to inject to datatables.
IV. fnRowCallback function is a datatable function , i have to put s.no there also $("td:nth-child(1)", nRow) is checkbox which will inject with primary key of your table in mysql.
V. bootbox.confirm is alert box , you can replace simple confim alert box of javascript if you don't need.
VI. $.each(response.idds.split(','), function () { $("#tr_" + this).hide();}); from ajax response comma seperated ids will be revert back from your controller.
3. Your controller function will go like below
public function get_account_listing() {
$this->load->model('common');
$aColumns = array('id', 'id', 'account_no', 'regdate', 'daysleft', 'name', 'email',
'country', 'mobile', 'leverage', 'balance', 'lead_source');
$aColumnsWhere = array('a.id', 'a.account_no', 'a.date_time', 'a.email', 'a.leverage', 'a.balance',
'da.firstname', 'da.lastname', 'da.regdate', 'da.mobile', 'c.country_name', 'da.lead_source');
$sIndexColumn = "id";
$sTable = "account";
//custome filter
$days_filter = (int) $this->input->get('days_filter', TRUE);
$iDisplayStart = $this->input->get('iDisplayStart', true);
$iDisplayLength = $this->input->get('iDisplayLength', true);
$iSortCol_0 = $this->input->get('iSortCol_0', true);
$iSortingCols = $this->input->get('iSortingCols', true);
$sLimit = "";
if (isset($iDisplayStart) && $iDisplayLength != '-1') {
$sLimit = "LIMIT " . $iDisplayStart . ", " .
$iDisplayLength;
}
if (isset($iSortCol_0)) {
$sOrder = "ORDER BY ";
for ($i = 0; $i < intval($iSortingCols); $i++) {
if ($_GET['bSortable_' . intval($_GET['iSortCol_' . $i])] == "true") {
$sOrder .= $aColumns[intval($_GET['iSortCol_' . $i])] . "
" . trim($_GET['sSortDir_' . $i]) . ", ";
}
}
$sOrder = substr_replace($sOrder, "", -2);
if ($sOrder == "ORDER BY") {
$sOrder = "";
}
}
$sSearch = $this->input->get('sSearch', true);
$sWhere = "";
if ($sSearch != "") {
$sWhere = "AND (";
for ($i = 0; $i < count($aColumnsWhere); $i++) {
$sWhere .= $aColumnsWhere[$i] . " LIKE '%" . $sSearch . "%' OR ";
}
$sWhere = substr_replace($sWhere, "", -3);
$sWhere .= ')';
}
if ($days_filter != '') {
$sWhere .= "AND (";
$sWhere .= '' . $aColumnsWhere[2] . ' BETWEEN DATE_SUB(NOW(),INTERVAL ' . $days_filter . ' DAY) AND
NOW()';
//$sWhere .= 'DATE('.$aColumnsWhere[12].')' . " BETWEEN
'" . DATE('Y-m-d',strtotime($start_date)) . "' AND '".DATE('Y-m-d',strtotime($end_date))."'";
$sWhere .= ')';
}
/* Individual column filtering */
for ($i = 0; $i < count($aColumns); $i++) {
if ($_GET['bSearchable_' . $i] == "true" && $_GET['sSearch_' . $i] != '') {
if ($sWhere == "") {
$sWhere = " WHERE ";
} else {
$sWhere .= " AND ";
}
$sWhere .= $aColumns[$i] . " LIKE '%" . trim($_GET['sSearch_' . $i]) . "%'";
}
}
$sEcho = $this->input->get('sEcho');
$result = $this->common->demo_account_listing($sTable, $sWhere, $sOrder, $sLimit,
$aColumns, $sIndexColumn, $sEcho);
echo json_encode($result);
}
4. Your model code goes like below
function demo_account_listing($sTable, $sWhere, $sOrder,$sLimit, $aColumns, $sIndexColumn, $sEcho){
$sJoin_q_fields = "SELECT SQL_CALC_FOUND_ROWS a.id,a.account_no,a.date_time,
a.email,a.leverage,a.balance, da.regdate, da.firstname as name,
da.mobile, c.country_name as country, da.lead_source";
$sJoin_q = " FROM (account a)";
$sJoin_q .= ' INNER JOIN demo_register da ON a.email = da.email';
$sJoin_q .= ' INNER JOIN country c ON da.country = c.id';
$sJoin_q .= ' WHERE a.act_type = "ABC" ';
$qJoin = $sJoin_q_fields . $sJoin_q . ' ' . $sWhere . ' ' . $sOrder . ' ' . $sLimit;
$rResult = $this->db->query($qJoin);
$rResult_array = $rResult->result_array();
$iFilteredTotal = count($rResult_array);
/* Total data set length */
$sJoin_q_count = "SELECT COUNT(" . $sIndexColumn . ") AS TotalRecords";
$sQuery_TR = $sJoin_q_count . $sJoin_q.$sWhere;
$rResult_TR = $this->db->query($sQuery_TR);
$rResult_array_TR = $rResult_TR->result_array();
$iTotal = $rResult_array_TR[0]['TotalRecords'];
$output = array(
"sEcho" => intval($sEcho),
"iTotalRecords" => intval($iTotal),
"iTotalDisplayRecords" => intval($iTotal), //$iFilteredTotal,
"aaData" => array()
);
$i = 0;
$last = intval($iTotal);
$seclast = intval($iTotal) - 1;
foreach ($rResult_array as $aRow) {
$row = array();
foreach ($aColumns as $col) {
if ($col == 'daysleft') {
$rem = $this->ref_time - strtotime($aRow['regdate']);
$row[] = 30 - floor($rem / 86400);
} else if ($aRow[$col] == 'D') {
$row[] = '<a href="javascript:void(0)" id="E_' . $aRow['id'] . '" name=""
class="btn btn-success btn-sm "><i class="entypo-check"></i> Enable</a>';
} else if ($aRow[$col] == 'E') {
$row[] = '<a href="javascript:void(0)" id="D_' . $aRow['id'] . '"
name="broker_account_status_request_ed" class="btn btn-danger btn-sm ">
<i class="entypo-minus"></i> Disable</a>';
} else {
$row[] = $aRow[$col];
}
}
$i++;
if ($i == $last || $i == $seclast) {
$classaction = 'dropup';
} else {
$classaction = '';
}
array_push($row, '<div class="btn-group ' . $classaction . ' ">
<button data-toggle="dropdown" class="btn red dropdown-toggle" aria-expanded="false">Action
<i class="fa fa-angle-down"></i>
</button>
<ul role="menu" class="dropdown-menu pull-right">
<li role="presentation">
<a href="' . base_url() . 'accounts/change_mt4_pw/' . $aRow['id'] . '" tabindex="-1" role="menuitem">
Change Password
</a>
</li>
<li role="presentation">
<a href="' . base_url() . 'accounts/delete_account/' . $aRow['id'] . '" tabindex="-1" role="menuitem">
Delete Account
</a>
</li>
<li role="presentation">
<a href="' . base_url() . 'accounts/link_account/' . $aRow['id'] . '" tabindex="-1" role="menuitem">
Link Account
</a>
</li>
</ul>
</div>');
$output['aaData'][] = $row;
}
return $output;
}
5. Your view load function will goes like below
public function index() {
$data['meta_title'] = 'Accounts';
$data['meta_keywords'] = 'Accounts';
$data['meta_desc'] = 'Accounts';
$data['top_mobile_menu'] = 'admin/dashboard/top_mobile_menu';
$data['top_menu'] = 'admin/dashboard/top_menu';
$data['main'] = 'admin/dashboard/accounts/account_listing';
$data['footer'] = 'admin/dashboard/footer';
$this->load->vars($data);
$this->load->view($this->admin_dashboard);
}
6. Your function for exporting i am using dompdf library for codeigniter. you can get it after googling.
public function create_document() {
$this->load->helper('dompdf');
$this->load->helper('file');
$this->load->model('prints');
$account_ids = $this->input->post('aidds');
$account_type = $this->input->post('atype');
$result = $this->prints->print_account_listing(format_in_clause($account_ids));
if (!empty($result)) {
$this->load->library('excel');
$this->excel->to_excel($result, "Aaccount-Listing");
exit;
} else {
$this->session->set_flashdata('msg',
alertmessage($message_type = 'alert-danger', $message = 'Unable to process your requiest.'));
redirect(base_url() . 'accounts');
}
}
7. Your function for removing records.
public function removeAccounts() {
$this->load->model('common');
$id = trim($this->input->post('rids'));
$account_type = trim($this->input->post('atype'));
if (isset($id)) {
$thread_ids = explode(",", $id);
foreach ($thread_ids as $values) {
$this->common->do_remove_records('account', array('id' => $values, 'act_type' => 'DEMO'));
}
echo json_encode(array('Mstatus' => 'success', 'idds' => $id,
'msg' => alertmessage($message_type = 'alert-success', $message = 'Accounts has been removed.')));
} else {
echo json_encode(array('Mstatus' => 'error',
'msg' => alertmessage($message_type = 'alert-danger', $message = 'Error in process. Try later.')));
}
}
8. alertmessage is a helper function for generating bootstrap message.
function alertmessage($message_type, $message) {
$output = '';
if (!empty($message_type) && !empty($message)) {
$output.="<div class='alert showmessage_jscbf " . $message_type . "'>" . $message . "</div>";
return $output;
} else {
return $output;
}
}
9. format_in_clause is a helper function.
function format_in_clause($string) {
if (isset($string)) {
$realArray = explode(',', $string);
if (is_array($realArray)) {
$stringForIn = "'" . implode("','", $realArray) . "'";
return $stringForIn;
} else {
return $string;
}
} else {
return NULL;
}
}
