I would like to know how to display multiple values in a single column in jqGrid
Here is a sample of my current grid definition.
$("#grid1").jqGrid({
url: 'Default.aspx/getGridData',
datatype: 'json',
...
colModel: [
...
//contains the input type ('select', etc.)
{ name: 'InputType', hidden:true },
...
//may contain a string of select options ('<option>Option1</option>'...)
{
name: 'Input',
editable:true,
edittype:'custom',
editoptions:{
custom_element: /* want cell value from InputType column here */ ,
custom_value: /* want cell value from Input column here */
}
},
...
]
});
You can do this easily by using a Custom Formatter on your column model.
A custom Formatter is a javascript function with the following parameters:
cellvalue - The value to be formatted
options - { rowId: rid, colModel: cm} where rowId - is the id of the row colModel is the object of the properties for this column getted from colModel array of jqGrid
rowObject - is a row data represented in the format determined from datatype option
So a function can be declared like so:
function myformatter ( cellvalue, options, rowObject )
{
// format the cellvalue to new format
return new_formated_cellvalue;
}
And is defined on your column like this:
{name:'price', index:'price', width:60, align:"center", editable: true,
formatter:myformatter },
So in your case you can use the rowObject parameter in the custom formatter to populate your additional values. For Example.
Column Model
{name:'employee_id', index:'employee_id', width:60, align:"center", editable: true,
formatter:myformatter, label:'Employee' }
Formatter
function myformatter ( cellvalue, options, rowObject )
{
return cellvalue + ' ' + rowObject.email + ' ' + rowObject.user_name;
}
And if this is defined on your employee_id column it would display in the cell:
employee_id email username
Here is a jsFiddle example showing it working.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With