Class Index | File Index

Classes


Class LABKEY.ext.EditorGridPanel


Extends Ext.grid.EditorGridPanel.

DEPRECATED - Consider using Ext.grid.EditorGridPanel instead.

LabKey extension to the Ext.grid.EditorGridPanel, which can provide editable grid views of data in the LabKey server. If the current user has appropriate permissions, the user may edit data, save changes, insert new rows, or delete rows.

If you use any of the LabKey APIs that extend Ext APIs, you must either make your code open source or purchase an Ext license.

Additional Documentation:


Defined in: EditorGridPanel.js.

Class Summary
Constructor Attributes Constructor Name and Description
 
Constructs a new LabKey EditorGridPanel using the supplied configuration.
Config Summary
Config Attributes Config Name and Description
 
Set to false if you do not want changes automatically saved when the user leaves the row (default is true).
 
Set to true if you want the user to be able to edit, insert, or delete rows (default is false).
 
True to enable user-filtering of columns (default is false)
 
The string to display in a cell when loading the lookup values (default is "[loading.
 
The string to display for a null value in a lookup column (default is "[none]").
 
Set to false if you do not want lookup foreign keys to be resolved to the lookup values, and do not want dropdown lookup value pickers (default is true).
 
Defines how many rows are shown at a time in the grid (default is 20).
 
Set to false to hide the Export button in the toolbar.
Method Summary
Method Attributes Method Name and Description
 
getLookupStore(columnName)
Returns the LABKEY.ext.Store object used to hold the lookup values for the specified column name.
 
Saves all pending changes to the database.
Event Summary
Event Attributes Event Name and Description
 
beforedelete(records)
Use this event to cancel the deletion of a row in the grid.
 
columnmodelcustomize(columnModel, index)
Use this event to customize the default column model config generated by the server.
Class Detail
LABKEY.ext.EditorGridPanel(config)
Constructs a new LabKey EditorGridPanel using the supplied configuration.
Basic Example: 
<script type="text/javascript">
    var _grid;

    //Use the Ext.onReady() function to define what code should
    //be executed once the page is fully loaded.
    //you must use this if you supply a renderTo config property
    Ext.onReady(function(){
        _grid = new LABKEY.ext.EditorGridPanel({
            store: new LABKEY.ext.Store({
                schemaName: 'lists',
                queryName: 'People'
            }),
            renderTo: 'grid',
            width: 800,
            autoHeight: true,
            title: 'Example',
            editable: true
        });
    });
</script>
<div id='grid'/> 
Advanced Example:

This snippet shows how to link a column in an EditorGridPanel to a details/update
page.  It adds a custom column renderer to the grid column model by hooking
the 'columnmodelcustomize' event.  Since the column is a lookup, it is helpful to
chain the base renderer so that it does the lookup magic for you.  
<script type="text/javascript">
var _materialTemplate;
var _baseFormulationRenderer;

 function formulationRenderer(data, cellMetaData, record, rowIndex, colIndex, store)
{
    return _materialTemplate.apply(record.data) + _baseFormulationRenderer(data,
        cellMetaData, record, rowIndex, colIndex, store) + '</a>';
}

function customizeColumnModel(colModel, index)
{
    if (colModel != undefined)
    {
        var col = index['Formulation'];
        var url = LABKEY.ActionURL.buildURL("experiment", "showMaterial");

        _materialTemplate = new Ext.XTemplate('<a href="' + url +
            '?rowId={Formulation}">').compile();
        _baseFormulationRenderer = col.renderer;
        col.renderer = formulationRenderer;
    }
}

Ext.onReady(function(){
    _grid = new LABKEY.ext.EditorGridPanel({
        store: new LABKEY.ext.Store({
            schemaName: 'lists',
            queryName: 'FormulationExpMap'
        }),
        renderTo: 'gridDiv',
        width: 600,
        autoHeight: true,
        title: 'Formulations to Experiments',
        editable: true
    });
    _grid.on("columnmodelcustomize", customizeColumnModel);
});
</script>
Parameters:
config
Configuration properties. This may contain any of the configuration properties supported by the Ext.grid.EditorGridPanel, plus those listed here.
Config Detail
{boolean} config.autoSave
Set to false if you do not want changes automatically saved when the user leaves the row (default is true).

{boolean} config.editable
Set to true if you want the user to be able to edit, insert, or delete rows (default is false).

{boolean} config.enableFilters
True to enable user-filtering of columns (default is false)

{string} config.loadingCaption
The string to display in a cell when loading the lookup values (default is "[loading...]").

{string} config.lookupNullCaption
The string to display for a null value in a lookup column (default is "[none]").

{boolean} config.lookups
Set to false if you do not want lookup foreign keys to be resolved to the lookup values, and do not want dropdown lookup value pickers (default is true).

{integer} config.pageSize
Defines how many rows are shown at a time in the grid (default is 20). If the EditorGridPanel is getting its data from Ext.Store, pageSize will override the value of maxRows on Ext.Store.

{boolean} config.showExportButton
Set to false to hide the Export button in the toolbar. True by default.
Method Detail
{LABKEY.ext.Store} getLookupStore(columnName)
Returns the LABKEY.ext.Store object used to hold the lookup values for the specified column name. If the column name is not a lookup column, this method will return null.
Parameters:
{String} columnName
The column name.
Returns:
{LABKEY.ext.Store} The lookup store for the given column name, or null if no lookup store exists for that column.

saveChanges()
Saves all pending changes to the database. Note that if the required fields for a given record does not have values, that record will not be saved and will remain dirty until values are supplied for all required fields.
Event Detail
beforedelete(records)
Use this event to cancel the deletion of a row in the grid. If you return false from this event, the row will not be deleted
Parameters:
{array} records
An array of Ext.data.Record objects that the user wishes to delete

columnmodelcustomize(columnModel, index)
Use this event to customize the default column model config generated by the server. For details on the column model config, see the Ext API documentation for Ext.grid.ColumnModel (http://www.extjs.com/deploy/dev/docs/?class=Ext.grid.ColumnModel)
Parameters:
{Ext.grid.ColumnModel} columnModel
The default ColumnModel config generated by the server.
{Object} index
An index map where the key is column name and the value is the entry in the column model config for that column. Since the column model config is a simple array of objects, this index helps you get to the specific columns you need to modify without doing a sequential scan.

Documentation generated by JsDoc Toolkit 2.3.2 on Thu Mar 14 2019 22:39:26 GMT-0000 (UTC)