How to filter the records using fnFilter on checkEmail js method
How to filter the records using fnFilter on checkEmail js method
sdhanya1030
Posts: 1Questions: 1Answers: 0
I have three columns. I have one checkbox on above datatable. When ever I am clicking the checkbox it should filter the email column with data.Email column is the second column on table.
Currently I have 4 rows.. Two rows have email address. and another don't have emeil records.
When ever checkbox is true - it returs 2 records
When ever checkbox is false- it returs all 4 records..
Please check the attached image for table
Please find my below code for reference
<head>
<apex:includeScript value="https://code.jquery.com/jquery-1.12.3.js"/>
<apex:includeScript value="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"/>
<apex:includeScript value="https://cdn.datatables.net/buttons/1.2.2/js/dataTables.buttons.min.js"/>
<apex:includeScript value="https://cdn.datatables.net/buttons/1.2.2/js/buttons.flash.min.js"/>
<apex:includeScript value="https://cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js"/>
<apex:includeScript value="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/pdfmake.min.js"/>
<apex:includeScript value="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/vfs_fonts.js"/>
<apex:includeScript value="https://cdn.datatables.net/buttons/1.2.2/js/buttons.html5.min.js"/>
<apex:includeScript value="https://cdn.datatables.net/buttons/1.2.2/js/buttons.print.min.js"/>
<apex:stylesheet value="https://cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css" />
<apex:stylesheet value="https://cdn.datatables.net/buttons/1.2.2/css/buttons.dataTables.min.css" />
<script type="text/javascript">
j$ = jQuery.noConflict();
function datatableInit(){
var oTable = j$('[id$="implementationtable"]').DataTable({
dom: 'Bfrtip',
"iDisplayLength": 25
});
}
function checkEmail(){
var oTable = j$('[id$="implementationtable"]').dataTable();
if (j$('input:checkbox[name="checkEmail"]').is(":checked")){
//which code I need to add for reslove this issue..
// oTable.fnFilter('', 1, false, false,false)
}else{
oTable.fnFilter('', 1, false, false,false);
}
}
j$(document).ready( function () {
datatableInit();
});
</head>
<body>
<div style = "margin-bottom:15px;">
<input type="checkbox" name="checkEmail" onclick = "checkEmail();"/> Has Email<br/>
</div>
<div class="pg" id="dataDiv" style="width:100%;">
<table id="implementationtable" class="hover display">
<thead>
<tr>
<th>Num</th>
<th>Email</th>
<th>Phone</th>
</tr>
</thead>
<tbody>
<tr>
<td>test1</td>
<td>tt1@gmail.com</td>
<td>123456789</td>
</tr>
<tr>
<td>test2</td>
<td>tt2@gmail.com</td>
<td>123456789</td>
</tr>
<tr>
<td>test</td>
<td></td>
<td>123456789</td>
</tr>
<tr>
<td>test3</td>
<td></td>
<td>123456789</td>
</tr>
</tbody>
</table>
</div>
</body>
This discussion has been closed.