I have added a button on search dialog of jqgrid for saving search criteria in database and use it for later. On the click of that button i need the filters property jqgrid of search criteria.
https://i.sstatic.net/31J5x.png [Snap Shot] when user click on save button (custom button added by me in search dialog) i had ask for filter name using dialog and then save it with the filter.
when search button is click i don't want to reload the grid base on search criteria.
but i am unable to get the filter property to store in data base.
i had use afterRedraw event but this is not give the last filter that i had add.
so please reply me soon.
Thanks in advance.
var grid = jQuery("#list_records").jqGrid({
url: "getGridData.php?" + window.location.search.substring(1),
searchurl: "getGridData.php?" + window.location.search.substring(1),
datatype: 'json',
mtype: "GET",
colNames: ["Task Id", "Title", "Priority", "tags", "Created Date", "Last Update Date", "Complete Date"],
colModel: [
{ name: 'Task_ID', index: 'Task_ID', width: 200},
{ name: 'Title', index: 'Title', width: 200 },
{ name: 'Priority', index: 'Priority', width: 200},
{ name : 'tags', index : 'tags', width : 200},
{ name : 'Created_Date', index : 'Created_Date', width : 200},
{ name : 'Last_Updated', index : 'Last_Updated', width : 200},
{ name : 'Completed_date', index : 'Completed_date', width : 200}
],
sortname: 'Task_ID',
viewrecords: true,
rownumbers: true,
sortorder: "desc",
ignoreCase: true,
pager: '#perpage',
caption: "Task Results",
rowNum: 30,
ajaxGridOptions: { contentType: 'application/json; charset=utf-8' },
});
grid.jqGrid('navGrid','#perpage', {add:false,edit:false,del:false,search:false,refresh:false}).jqGrid('navButtonAdd','#perpage',{
caption: "",
title : "Search",
id : "filterManipulation",
buttonicon:"ui-icon-search",
onClickButton: function (){
//console.log(JSON.stringify(filterForSearch));
$("#list_records").setGridParam({
postData: { filters: JSON.stringify(filterForSearch)}
});
$("#list_records").jqGrid('searchGrid',
{multipleSearch:true, overlay:false, searchOnEnter:true, multipleGroup:true, closeOnEscape:true, showQuery:true,recreateFilter: true,
afterShowSearch : function(){
var element = document.getElementById("fbox_list_records_2").getElementsByTagName("tr")[1].getElementsByTagName("td")[1];
var saveAnchor = document.createElement('a');
saveAnchor.setAttribute('id', 'fbox_list_save_query');
saveAnchor.setAttribute('class', 'fm-button ui-state-default ui-corner-all fm-button-icon-left');
saveAnchor.setAttribute('onclick','saveSearch()');
saveAnchor.innerHTML = buttonName;
var newAnchor = document.createElement('a');
newAnchor.setAttribute('id', 'fbox_list_new_filter');
newAnchor.setAttribute('class', 'fm-button ui-state-default ui-corner-all fm-button-icon-left');
newAnchor.setAttribute('onclick','newFilter()');
newAnchor.innerHTML = 'New';
element.appendChild(newAnchor);
element.appendChild(saveAnchor);
var tableDataTag = document.createElement("td");
tableDataTag.setAttribute('id','tdForFilterNameList');
var filterNameList = document.createElement("select");
filterNameList.setAttribute('id','filterNameList');
filterNameList.setAttribute('onChange','loadFilterAttribute()');
var option = new Option("--Select--", "0");
filterNameList.appendChild(option);
<?php
$userId = 0;
$conn = new mysqli("localhost", "root", "$$$$", "$$$");
if (mysqli_connect_errno()){
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
$sql = "select filter_id,filter_name from filters where userID = $userId ";
//print $sql;
$result = $conn->query($sql);
if($result)
{
while ($row = $result->fetch_assoc()) {
?>
var optionTag = document.createElement("option");
optionTag.setAttribute("value", "<?php echo $row['filter_id']?>");
var text = document.createTextNode("<?php echo $row['filter_name']?>");
optionTag.appendChild(text);
if(selectedValue == "<?php echo $row['filter_id']?>"){
optionTag.setAttribute("Selected", "true");
}
//option = new Option('<?php echo $row['filter_name']?>', '<?php echo $row['filter_id']?>');
filterNameList.appendChild(optionTag);
<?php
}
}
?>
tableDataTag.appendChild(filterNameList);
var elementForDropDown = document.getElementById("fbox_list_records").getElementsByTagName("table")[0].getElementsByTagName("tr")[0];
elementForDropDown.appendChild(tableDataTag);
},
onSearch: function() {
var postData = grid.jqGrid('getGridParam','postData');
var $filter = $("#" + $.jgrid.jqID("fbox_" + this.id)),
sql = $filter.jqFilter('toSQLString');
$("#list_records").setGridParam({url: "getGridData.php?" + window.location.search.substring(1) + "&sqlQuery=" + escape(sql)});
$("#list_records").trigger("reloadGrid");
loadgridData(postData, sql);
fusionChart(postData, sql);
return false;
},
onReset : function() {
var postData = grid.jqGrid('getGridParam','postData');
$("#list_records").setGridParam({url: "getGridData.php?" + window.location.search.substring(1)});
$("#list_records").trigger("reloadGrid");
loadgridData(postData, '');
fusionChart(postData, '');
return false;
},
onClose: function(){
filterForSearch = "";
buttonName = "Save";
selectedValue = "";
},
afterRedraw: function (p) {
console.log(p.filter);
}
});
},
position:"last"
});
In above code i had added custom nav button. this code is for loading search filter of user . way to store and edit filter .
But what should i do to get filter where save button click.
thanks @jtc for reviewing my question. Answer of my question is already in my question.
Basically I had implemented Save, Update, Delete functionality in advance search dialog.
In search Dialog i had list all the filters of particular user.
User can Create new filter and also Update and Delete the filter by selecting it.
So later when user again logged in he/she done all manipulation on filters and selecting particular field from list of filters and perform Search accordingly.
So if any one need code let me know for this functionality .
Thanks
