Why jgGrid alway insert new row as last row of last page after paging, sorting, filter?
I use datatype: local.
Add row method:
var records = g.getGridParam("records") + 1;
var addedIndex = Date.now();
g.addRowData(records , { }, 'first');
//var addedRecordIndexes = g.getGridParam('addedRecordIndexes');
//addedRecordIndexes.push(addedIndex);
g.editRow(records , true, function () {});
But after paging, sorting, filtering, new inserted row is alway move to last row of last page. I try to use
g.addRowData(1, {}, 'first') but no luck.
Why is this bug serious?
This will make user confuse if they insert new row, then change to another page, then back. Oops, where is my new row?
But actually, it's in last page at last row.
Related
I wish to iterate through jqGrid, and for a given column (ie: the second) I wish to insert a value. How do you find the first data row? The documentation warns to not use getRowData if updating row or cell data.
This is what I'm using, but it seems clumsy:
function loadCompleted() {
var $grid = jQuery("#jqGrid"), rows = $grid[0].rows;
for (var i = 1; i < rows.length; i++) {
var row = rows[i];
var id = row.cells[0].innerHTML;
$(row.cells[1]).html("<a href='#' onclick='deleteApp(" + id + "); return false;'>Delete</a>");
}
}
... this works, but it makes the assumption that the first data row is the second row in table #jqGrid. It also relies on index values for columns 1 and 2.
Is there any way to use setRowData when the documentation warns to not use getRowData when editing the row or cells?
The first row in grid is hidden and is used in the jqGrid for internal purposes.
I think that using a custom formatter will do the job.
Example of custom formatter can be found here. If you use Guriddo jqGid you may look into the docs for the parameters passed.
Simple question, hard to find an answer:
If I try to select a row programmatically, I use this:
$('#grid').jqGrid('setSelection', rowId);
The problem is that it only selects rows on current visible page. If rowId is on another page, it will not be selected.
More info: My goal is to select multiple rows (spread on multiple pages) when page loads for the first time.
Thanks,
Rafael
PS: This guy has the same problem. No answer yet:
jqgrid multiselect only selects rows on the current page, if paging is enabled. How to make it select rows across pages?
Right, jqGrid will only select rows on the current page. In order to select other rows you need to maintain a list of selected ID's and manually select them.
To do this you need to add code to your loadComplete event to search the current page and select any of these rows:
var ids = grid.jqGrid('getDataIDs');
for (var i = 0; i < ids.length; i++){
if (selected[ids[i]] === true ){
grid.setSelection(ids[i], false);
}
}
You also need to add code to your onSelectRow and onSelectAll events to adjust the contents of selected when the user selects/unselects rows:
onSelectRow: function(rowid, status){
selected[rowid] = status;
setSelectedDeviceCount();
},
onSelectAll: function(rowids, status){
for (var i = 0; i < rowids.length; i++){
selected[rowids[i]] = status;
}
}
Does that help?
Please see this:
https://stackoverflow.com/a/24941828/136219
For a way to achieve what you are looking for.
I have a in-line delete button, I want to append more data to the delete message pop-up like this:
"Delete selected row with code = 7 ?"
I'm using the following in the delOptions:
beforeShowForm: function ($form) {
var sel_id = $("#list").jqGrid('getGridParam', 'selrow');
$("td.delmsg", $form[0]).html("Delete record with <b>code=" + $("#list").jqGrid('getCell', sel_id, 'cd') + "</b>?");}
The problem is If I click on the delete button without first clicking on any part of the row, the selrow is either null or it gets the previously selected row not the currently selected!
How do I make the row selected when clicking on the trash bin icon?
Any help is appreciated
I suppose that you use the example which I posted in the old answer. It was written in case of usage of the Delete button (the part of form editing) from navigator bar.
There are one hidden row in the Delete dialog which could help you. Try this one
beforeShowForm: function ($form) {
// get comma separated list of ids of rows which will be delete
// in case of multiselect:true grid or just id of the row.
// In the code below we suppose that single row selection are used
var idOfDeletedRow = $("#DelData>td:nth-child(1)").text();
$form.find("td.delmsg").eq(0)
.html("Delete record with <b>code=" +
$(this).jqGrid('getCell', idOfDeletedRow, 'cd') + "</b>?");
// REMARK: in old versions of jqGrid you can't use $(this) and
// will have to use something like $("#list")
}
I delete a row in a jqGrid like so:
elem.jqGrid('delRowData', rowid);
But the subgrid associated to this row remains. What other clever thing do I need to do to make the whole row (including subgrid) go away?
You can do instead of the code which you posted the following:
var selRow = $('#'+rowid), // get the row (<tr> element having id=rowid)
nextRow = selRow.next(); // get the next row
if (nextRow.hasClass('ui-subgrid')) {
// if the next row is a subgrid one should remove it
nextRow.remove();
}
elem.jqGrid('delRowData', rowid);
// the call of delRowData is better as just selRow.remove();
// because it change "records" and "reccount" parameters and
// change parameters "selrow" and "selarrrow" in case that
// the deleted row was selected.
This seems to work:
elem.jqGrid('collapseSubGridRow', rowid);
elem.jqGrid('delRowData', rowid);
Umm, okay.
I am using ajax function to call a method on server side which will return a set of values, I need to add these values to the next row of a jqgrid. How to insert values to a jqid by iterating the rownumber?
After you receive the data from the the server you can add there to the grid. For example, if your grid has colModel with column names 'invid','invdate','amount','tax','total','note'. The code which add the row could be about following
var myfirstrow = {invid:"1", invdate:"2007-10-01", note:"note",
amount:"200.00", tax:"10.00", total:"210.00"};
$("#grid_id").jqGrid("addRowData","1", myfirstrow);
where "1" is the id of the data which you want to add.
If you want to add data to a special position in the grid, for example, after the selected row you can do almost the same:
var grid = $("#grid_id");
var selRowId=grid.jqGrid('getGridParam','selrow');
var myData = {invid:"1", invdate:"2007-10-01", note:"note",
amount:"200.00", tax:"10.00", total:"210.00"};
grid.jqGrid("addRowData", "1", myData, "after", selRowId);
See Data Manipulation part of the jqGrid documentation. By the way with respect of addRowData method you can add many rows to a grid at one call. In the case the data parameter must be array of row data.