Please go through the demo where you can add filters just using magic hooks.
http://test.spgon.in/filtering/Tasks_view.php
Tasks-tv.js
Code: Select all
jQuery(document).ready(function($) {
var url1 = "./users.php"; //url for getting Options values from DB
var str = '<select class="btn btn-default" name="username" id="sel1">';
str = str + '<option value="%">All</option>';
jQuery.ajax({
url: url1,
dataType: 'json',
success: function(result) {
for (i = 0; i < result.length; i++) {
str = str + '<option value=' + result[i] + '>' + result[i] + '</option>';//assigning values to the dropdown with the obtained data from DB
}
str = str + '</select>';
jQuery('#NoFilter').after(str);
var str2 = '<select class="btn btn-default" name="username" id="sel2">';//manually created dropdown and its options
str2 = str2 + '<option value="%">All</option>';
str2 = str2 + '<option value="Open">Open</option>';
str2 = str2 + '<option value="Close">Close</option>';
str2 = str2 + '<option value="On-Hold">On-Hold</option>';
str2 = str2 + '</select>';
jQuery('#sel1').after(str2);
var str3 = '<button id="sub_filter" type="button" class="btn btn-success">Submit</button>';
jQuery('#sel2').after(str3);
jQuery('#sub_filter').click(function() {
var usr = document.getElementById('sel1').value; //Filter value for filter1
var type = document.getElementById('sel2').value; //Filter value for filter2
var filter_field1 = 9; //filtering field number for filter1
var filter_field2 = 10; //filtering field number for filter2
var url = encodeURI('Tasks_view.php?FilterField[1]=' + filter_field1 + '&FilterOperator[1]=like&FilterValue[1]=' + usr + '&FilterAnd[2]=and&FilterField[2]=' + filter_field2 + '&FilterOperator[2]=like&FilterValue[2]=' + type);
window.open(url, "_self")
});
}
});
});