I am trying to change the recordtext of a display grid to a custom format. I am using a treeview as the selector that refreshes the display grid. I need to find the total records for the grid and I am able to get this value using the getGridParam records method when I click on the treeview node and load the display grid.
However, after I get this value and try to create the custom recordtext, the record count is the previous value, not the current records count. I know that the gridComplete happens before the loadComplete, but even placing the get in the gridComplete and the set int he loadComplete, it still doesn't work, even with a reloadGrid trigger. If I click on the treeview node twice, I get the correct value.
I am thinking it is a timing issue as to when the new value is ready to set the recordtext. Any help would be great, thanks in advance.
I recommend you to try updatepager method, which updates the information on the pager. Alternatively you can do for example the following:
loadComplete: function () {
var p = $(this).jqGrid("getGridParam");
p.records = 123;
p.recordtext = "My View {0} - {1} of <i>{2}<i>";
this.updatepager();
}
to see the viewrecords
Related
I have a view panel in xpages and a computed field to show the row-count. I have 2 problems:
1st: how can i count only the rows of the current page of the pager?it seems that viewPanel.getRowCount() gets all rows from the beginning until the current page, so if i have 30 entries per page and i am in page 2, it shows 60 instead of 30.
2nd: even if i achieve the above, the pager only refreshes the view and i can't refresh the computed field or another panel. Can i put the computed field inside the view panel or make it somehow to be refreshed in each page change? i would prefer not to do it with full page refresh if possible...
Given the computed field refresh issue, even if you managed to get a count of rows (eg on a page-scope SSJS variable), it woudln't update the computed field.
It might be easier to to count to rows in the HTML table using clientside javascript ?
something like ..
page onload event :
get the HTML table
get the table rows property (array of rows in the table)
number or rows = that value (1st row = TH (header) row if there is one = row 0)
use javsscript to plug that value into a known DIV
You could also hijack the partial refresh issued from the pager and check for the ID that has been refreshed. If the ID match your view panel's ID, you could do another partial update in order to update another panel.
Example code for hijacking the partial refresh:
var sysHijackPartialRefresh = function(){
XSP._inheritedPartialRefresh = XSP._partialRefresh;
XSP._partialRefresh = function( method, form, refreshId,options) {
if (options){
if (!options.onComplete) {
options.onStart = function(){
};
options.onComplete = function(){
if (refreshId == "<client id of view panel>") {
// issue another partial refresh
XSP.partialRefreshGet(<client id of the other panel>);
}
};
}
}
this._inheritedPartialRefresh(method, form, refreshId, options); }
}
XSP.addOnLoad(sysHijackPartialRefresh);
See http://xpageswiki.com/web/youatnotes/wiki-xpages.nsf/dx/Work_with_events_and_partial_or_full_refresh for more information about partial updates.
The pager should have a "refreshID" property in which you can put the client ID (!) of the panel you want to refresh. Use getClientId() to compute the client ID of the panel.
For the row count: use the XPages debug toolbar (from openNTF) to check for a property of the view panel or the pager which gives you the current page number. If you got that, you can simply compute by using viewPanel.getRowCount() - (page number * number of rows per page).
I am facing problem in Jqgrid. I have a column with hyperlink and on the click of that hyperlink I want row data. Is this possible using Jqgrid. when I am using "getGridParam" I am getting row id as null.
There are two possibilities you can try here:
1) You can use a custom formatter to create the hyperlink, and have a custom attribute on the link where you put in the rowid (prefix the custom attribute name with 'data-' to keep it html5 compatible). Alternatively you could call a javascript function explicitly passing the row id.
2) Instead of the hyperlink's event itself, try using the onCellSelect event of jqGrid where you get the row and column id of the clicked cell, even if its a hyperlink. But this would trigger the event even if the user clicks anywhere inside the cell, not just on the link!.
I'm sure you found the answer to this by now but for some of you using ASP.NET WebForm here is what I used.
Create the Custom Formatter and add it to the column where you want the link to appear:
My columns are from a database I use a Select statement as so:
switch (jqGrdCol.DataField)
{
case "xxx":
CustomFormatter hypLinkxxx = new CustomFormatter();
hypLinkxxx.FormatFunction = "xxxformatOperations"; --> **JavaScript Function**
jqGrdCol.Formatter.Add(hypLinkxxx);
break;
}
Then in the Javascript function:
function xxxformatOperations(cellvalue, options, rowObject) {
return "<a href=somefile.aspx?xxx=" + rowObject[0] >" + cellvalue + "</font></a>"
}
I get the value of the column as a hyperlink.
I had a similar issue and was did look into your question to figure out a solution and I have found out a solution to this.
The solution is by using onCellSelect: function(rowid, index, contents, event)
this gives the rowid and contents ie the content of the cell you have clicked or selected
therfore you can get the entire row of contents which includes your hyperlink as well
I'm using jqGrid's filterToolbar method to let users quick search/filter the grid data. I'm using loadonce: true and datatype: local as my grid configs. I have a drop-down (select) filter type for one of my columns, which works fine.
Problem is when i try to update a row (using setRowData) that is not visible (because the filter/search result is hiding them), the row doesn't get updated when I reshow them by clearing the filter.
Any suggestions? I've tried triggering the reloadGrid event too, no luck.
Cheers
Update 1 - Reproducing the problem:
Here's how to reproduce the problem, using jqGrid's official demos:
Step 1
Browse to the jqGrid's demo page, and open the demo named 'Toolbar search' under 'New in version 3.7'
Step 2
In the demo grid, filter by the code column with the value 575878 so that only the first row is shown on the grid.
Step 3
Bring up the javascript console and update a row that's not currently visible, in this example update row 2:
jQuery("#toolbar").jqGrid('setRowData',2,{item_id:2,item:'blargh',item_cd:12345678});
Step 4
Unhide all the rows by clearing the filter value, and see that row 2 has not been updated!
Anything I'm doing wrong here? Possible workarounds?
You misunderstand how the grid are build. Grid can contain hidden columns, but no hidden rows. If one filter grid the full grid body will be removed and only the filtered rows will be inserted.
The method setRowData can be used to modify any row of the grid, but you can't modify something which is not present in the grid.
If you use local grid (datatype: 'local') then the data which you save in the grid will be saved in two internal jqGrid parameters data and _index. So you should modify the data object. To fill grid with modified data you need call .trigger("reloadGrid").
So if you want modify columns item_id, item and item_cd of the grid's data for the rowid=2 you can do the following steps.
1) Get references to the internal jqGrid parameters data and _index:
var $myGrid = jQuery("#toolbar"),
data = $myGrid.jqGrid('getGridParam', 'data'),
index = $myGrid.jqGrid('getGridParam', '_index');
2) Get reference to the object which represent the rowid which you need:
var rowId = '2',
itemIndex = index[rowId],
rowItem = data[itemIndex];
3) Modify the data item like you as need:
rowItem.item_id = 2;
rowItem.item = 'blargh';
rowItem.item_cd = 12345678;
4) Refresh grid contain (if needed) by reloading the grid
$myGrid.trigger('reloadGrid');
I have created at a table using jqGrid. In that I have a comboBox. I want the values of the combobox such that It is not used in the previous row.
But, once my first row displayed, then I am unable to change the values of comboBoc in the second row.
Ex: In my combobox, there are three values .. one, two, three. I have selected value "two" in the first row. Then the combo box of the second must have two values: one and three.
I have tried the following code:
$("#listData").setColProp('denomination',
{editoptions:{value:getDenominationList('addOperation').toString()}});
Here:
getDenominationList('addOperation') will return a String "1:one;3:three"
But this is not working.
I hope I understand correct your question and you want to change the value parameter of editoptions every time depend on the current row id or other grid contain. You can do this inside your custom dataInit event handler (see editoptions):
dataInit: function (elem) {
var v = $(elem).val();
var rowId = $(e.target).closest('tr.jqgrow').attr('id');
var newValue = getDenominationList('addOperation').toString();
$("#listData").setColProp('denomination', { editoptions: { value:newValue} });
}
The function getDenominationList used in your question don't has the rowid parameter which you probably will need. To simplified it I included in the code above the line which show how the id of the row can be got.
I recommend you to look inside the another answer which I recently answered. It showed how the initial values of value property can be reseted in case of inline editing. It you use form editing you should do this inside of onClose event handler. Moreover in case of form editing you must use recreateForm:true which will force that dataInit event handler will be called not once, but on every row editing.
I have a grid with a subgrid: Only the first row of the Main grid need to have a subgrid.
The solutions I found by Google and http://www.trirand.com/....i:subgrid&s[]=hidecol
doesn't work.
Is there a quick and dirty (hard coded) solution?
Hiding the 'subgrid' column with jQuery("#grid_id").hideCol('subgrid'); remove full column which can be used to expand or collapse the subgrid, so you can not use the way in your case.
I suggest you to clear contain of the 'subgrid' column and unbind the 'click' event for the cells inside of loadComplete event handle:
loadComplete: function() {
$("td.sgcollapsed:not(:first)","#list").unbind('click').html('');
}
you will have the following results:
(You can see the corresponding example live here). It's important to understand, that the loadComplete event will be called on any page, so on the second page you will have subrgid also only on the first row.
If you need to implement more complex logic in choosing of the rows which need have subgrids you can use following code
loadComplete: function() {
var grid = $("#list");
var subGridCells = $("td.sgcollapsed",grid[0]);
$.each(subGridCells,function(i,value){
if (i!==0) {
$(value).unbind('click').html('');
}
});
}
The code above do the same as the statement $("td.sgcollapsed:not(:first)","#list").unbind('click').html(''), but you can easy modify the last version of the code to implement more complex behavior.
UPDATED: If you need detractive subgrid only for some row identified by the rowid you can use
$("#"+rowid+" td.sgcollapsed",grid[0]).unbind('click').html('');
(see live here) inside of the loadComplete. If you need deactivate subgrid for all rows which id is not equal to rowid you can make something like following
$('td.sgcollapsed:not("#'+rowid+' td.sgcollapsed")',grid[0]).unbind('click').html('');
(see live here)
UPDATED: free jqGrid now have new feature described in the answer: hasSubgrid callback which can be specified in subGridOptions. It allows to inform jqGrid which rows should don't have subgrids.