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
Related
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
I have a telerik:RadGrid that contains Bound Data,
I am calling Popup Edit Control Of RadGrid, I am getting all the fields and edit works fine.
What I want to do is from the Edit Popup, Edit one of the fields (Which is a RadTextBox) by clicking a button to open a RadWindow, this Window Contains another RadGrid with user details and one of the column with a button that executes RadGrid_OnCommand event, I am passing one of the values of the Grid by:
CommandArguments='<%# Eval("UserName")%>'
How can I place this value to the RadTextBox.Text in the Edit PopUp, So that I can update the grid with the selected value?
I would really appreciate any help. Thank you in Advance
I solved the issue by geting the grid row, which is in edit mode so I got the value of which row I need to change and updated its Editible item by ID using this code:
var rowid = RadGrid1.EditIndexes[RadGrid1.EditIndexes.Count-1];
GridEditFormItem rowEditControls;
foreach (GridDataItem row in RadGrid1.Items)
{
if (row.ItemIndex == int.Parse(rowid))
{
rowEditControls = row.EditFormItem;
((rowEditControls as GridEditableItem).FindControl("ID") as RadTextBox).Text = e.CommandArgument.ToString();
}
}
I Hope this will be helpfull for someone, I find it valuable for customising your edit forms.
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'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 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.