I want to delete multiple rows in my grid, but when I select multiple rows and click on the delete button, nothing happens. No parameters are passed to the editurl!
please help. Here is my code for the delete options inside navGrid:
{height:180,mtype:"POST",closeAfterDel:true, url:'gridedit.jsp',reloadAfterSubmit:true,
onclickSubmit: function (options, rowid) {
var rowData = jQuery(this).jqGrid('getRowData', rowid);
var params ={amount:rowData.amount,account:rowData.account.replace(/-/g,"")};
return params;
},
afterSubmit: function () {
$(this).jqGrid('setGridParam', {datatype:'json'});
return [true,''];
}
If you use multiselect: true option the second parameter of onclickSubmit of delete option will be comma separated list of ids, which will be deleting instead of just one rowid. So you have to modify your code of onclickSubmit. The direct usage of jQuery(this).jqGrid('getRowData', rowid) will be wrong. You have to make var rowids = rowid.split(",") and then iterate (with for-loop for example) over the array of rowids. You can use getRowData with rowids[i] as parameter. You have to return array of items like params instead of one object.
Related
afterSaveCell: function () { $(this).trigger('reloadGrid');},
If I put this in my grid it works well, reloads the grid after a cell edit. Is there an easy or known way to reload only on a specific cell ? something like
//afterSaveCell: function () {
If(the field is budgetyear1){
$(this).trigger('reloadGrid');}
},
First of all you should always place the call of trigger('reloadGrid') inside of setTimeout. It's important because trigger('reloadGrid') works synchronously and the next line after trigger('reloadGrid') will be executed only after reload is finished. If you reload the data from the server, then it's not so critical, but some internal parameters of jqGrid can be already reset (the page number for example).
About you main question: afterSaveCell will be called with 5 parameters: rowid, columnName, cellValue, iRow, iCol. It gives you enough information about the clicked cell and you can use getCell method to get information about any other columns of the row. Thus your could be about the following:
afterSaveCell: function (rowid, columnName, cellValue, iRow, iCol) {
var $self = $(this); // cache this to be used later in `setTimeout`
if (/*test some conditions*/) {
setTimeout(function() {
$self.trigger("reloadGrid");
}, 50);
}
}
I have 2 bootstrap-multiselect boxes. I want to refresh the items in one based on the selections made in the other via an Ajax call.
Everything work except that the that the multiselect uses to disoplay the options is not being populated by either 'rebuild' or 'refresh'.
Code:
Decalring the multiselect"
$('#Groups').multiselect({
onChange: function (option, checked) {
//get all of the selected tiems
var values = $('#Groups option:selected');
var selected = "";
$(values).each(function (index, value) {
selected += $(value).prop('value') + ",";
});
selected = selected.substring(0, selected.length - 1);
//update hidden field with comma delimited string for state persistance
$("#Hidden_Groups").val(selected);
},
includeSelectAllOption: true
});
Updating the options list:
$('#JobCodes').multiselect({
onDropdownHide: function(event) {
console.log("start");
var option = $("#Groups");
//clear out old consolidations
option.empty();
console.log("emptied");
////get consolidation and append to select options list
$.getJSON("/Reports/GetGroups/", { options: $("#Hidden_JobCodes").val() }, function (result) {
$.each(result, function (index, item) {
console.log(item.text);
option.append($("<option />").val(item.id).text(item.text));
});
});
option.multiselect('destroy');
option.multiselect('rebuild');
option.multiselect('refresh');
},
Have left the destroy, rebuild and refresh in just as an example things i have tried. Have used all of these in every order and combination and no luck.
Destroy will "change" my multiselect back to a standard select but no matter what I do after that I cannot get the multiselect to come back with the new list of options, including using the full multiselect call wiht the onchange event present. Its either empty of has the old list. The select list has the correct options present when I make the refresh/rebuild calls.
Thanks in advance.
T
Totally my fault!!
The call to /destroy/refresh/rebuild was outside of the ajax call. so the were executing before my new list had been returned, hence no list to rebuild at that time.
Solution:
////get consolidation and append to select options list
$.getJSON("/Reports/GetGroups/", { options: $("#Hidden_JobCodes").val() }, function (result) {
$.each(result, function (index, item) {
console.log(item.text);
option.append($("<option />").val(item.id).text(item.text));
});
option.multiselect('rebuild')
});
I am using a custom formatter to create hyperlinks in one of the columns of my grid.
In my code, there are cases when I need to disable the selected row. The row disabling works as I want it to, but the hyperlink for that row is not disabled. I can not select the row and all the other column values are displayed as grey colored to indicate that the row is disabled. The only column whose content does not change color is the one having links.
Any ideas on how to disable links?
This is my loadComplete function:
loadComplete: function (data) {
var ids =jQuery("#list").jqGrid('getDataIDs');
for(var i=0;i < ids.length;i++){
var rowId = ids[i];
var mod = jQuery("#list").jqGrid('getCell',ids[i],'mod');
if(mod=='y'){
jQuery("#jqg_list_"+rowId).attr("disabled", true);
$("#list").jqGrid('setRowData',ids[i],false, {weightfont:'bold',color:'silver'});
var iCol = getColumnIndexByName.call(this, 'adate');
$(this).jqGrid('doInEachRow', function (row, rowId, localRowData) {
$(row.cells[iCol]).children("a").click(function (e) {
e.preventDefault();
// any your code here
alert("No Good");
return false;
});
});
}
}
}
I want the links disabled in all the rows where the value of the column mod=y
You can try to use onClick callback of dynamicLink formatter described here, here and here. It gives you maximum flexibility. Inside of onClick callback you can test something like $(e.target).closest("tr.jqgrow").hasClass("not-editable-row") and just do nothing in the case.
Whenever we select rows the in jqGrid and perform search operation at the end search reloads the grid and all the user checked rows are unchecked .... I want the selected rows to be selected even after search perform or we go to next page.
Does anyone have solution on this?????? I need it URGENT
You should remember the selected rows before search and select them again after. For example, you define onSearch event:
var selected_rows = [];
onSearch: function(){
selected_rows = $('#your_grid').jqGrid('getGridParam', 'selarrrow');
}
Then you define gridComplete event, so that it would select the rows if any:
gridComplete: function(){
$.each(selected_rows, function(_, row_id){
$("#your_grid").jqGrid('setSelection', row_id, false);
});
selected_rows = [];
}
You can use onPaging event in similar way to deal with paging.
I need to pass or make available a jqgrid colModel column name to a function triggered by the jqgrid event "onclickSubmit:" defined in the edit options of navGrid - but i don't know how to do that.
here are the jqgrid and javascript code segments:
..., onclickSubmit: fixpostdata}, // navGrid edit options
.
.
.
var fixpostdata = function(params, postdata){
var rowid = $('#tab3-grid').getGridParam('selrow');
// when the onclickSubmit event fires and calls this function,
// a string containing a jqgrid colmodel column name needs to be
// made available in order to modify that cell's value contained
// in the postdata array prior to posting it to the server.
columnName = ???;
var value = $('#tab3-grid').jqGrid('getCell', rowid, columnName );
postdata[ columnName ] = value;
return;
}
Can anyone help?
also,
what's contained in the params argument?
If you need to send contain of some hidden column to the server together with other editable columns you need include editable: true in the hidden column and add one more property
editrules: { edithidden: false }