Javascript System Events

IN THIS PAGE

Description

The Grid Object contains a very rich system of client-side events that you can use to customize the Grid behavior.

These events are accessible through the System Events property under the JavaScript - System Events section of the Properties page. Clicking the button next to this property opens the Client-side Grid System Events dialog. This dialog shows all of the client-side events you can use and gives a short description of each event. Event handlers for client-side system events are coded using Javascript. If the event makes any data available to the executing Javascript code, then the names of any parameters used will show up in the 'Parameters' section. You can use the 'Filter' box to filter the list of events and locate a given event quickly. You can also use the 'Defined events only' checkbox to quickly find the events for which you have defined code.

Inserting Placeholders and Grid Methods: 

When you write the Javascript event handlers, you might want to use certain placeholders in your Javascript. These placeholders get replaced by actual values when the Grid is rendered. For example, the {Grid.componentName} placeholder gets replaced with the actual Grid alias at run-time. To insert a placeholder in your code, click the 'Insert placeholder...' hyperlink. Your Javascript code can call any of the methods that the Grid object exposes. To see a list of the methods, click the 'Insert Grid method...' placeholder.

Example of How to Use Client-Side Events: 

Say you wanted to put up a dialog that said 'Searching. Please wait..' while your Grid component was performing a search. As soon as the search completed, you want to remove the message. To do this you would add code to the 'canSearchSubmit' event to show the message. A5.msgBox.show('Searching...',' Please wait while we search for the records.

','none',function() {});

Then in the 'afterSearchSubmit' event, you would clear the message.

A5.msgBox.hide();

Client-side events that are exposed to the developer: 

  • beforeAjaxCallback 

    Fires before any Ajax callback is made to the server. The e.ajaxEvent property contains the name of the action that triggered the callback. This event can be used to put up a working message while the callback is executing.

  • afterAjaxCallbackComplete 

    Fires after any Ajax callback has been completed and the Browser has received a response from the server. The e.ajaxEvent property contains the name of the action that triggered the callback.

  • afterAlphabetButtonSearch 

    Fires after the user has executed an Alphabet button search in the Grid part.

  • afterDetailViewCancelEdits 

    Fires after user has cancelled edits in the Detail View part.

  • afterDetailViewClose 

    Fires after the Detail View has been closed.

  • afterDetailViewDeleteRecord 

    Fires after the user has deleted a record in the Detail View.

  • afterDetailViewNewRecord 

    Fires after the user has clicked a hyperlink or button to enter a new row in the Detail View.

  • afterDetailViewOpen 

    Fires after the detail view for a particular record is shown.

  • afterDetailViewSubmit 

    Fires after the user has submitted edits made to a record in the Detail View. The 'hasErrors' parameter is true if there were any errors when committing the data.

  • afterDetailViewSwitchFromEditable 

    Fires when the user has switched the current record in the Detail View from editable to not editable. Only fires if Detail View is set to edit on demand.

  • afterDetailViewSwitchToEditable 

    Fires when the user has switched the current record in the Detail View to be editable. Only fires if Detail View is set to edit on demand.

  • afterGridCancelEdits 

    Fires after the user has cancelled edits in the Grid part by clicking on the Cancel button. Contrast with afterRowCancelEdits.

  • afterGridSubmit 

    Fires after the user has submitted edits to the Grid part and the server has processed the edits. The 'hasErrors' parameter is true if there were any errors when committing the data.

  • afterOpenLookup 

    Fires after the user has opened a Lookup Grid window.

  • afterPageNavigate 

    Fires after the user has navigated to a new page of records.

  • afterQBEHide 

    Fires after the user has hidden the QBE (Query by Example) row.

  • afterQBESearch 

    Fires after the user has performed a QBE (Query by Example) search. The 'qbeType' parameter specifies the name of the option from the QBE menu that was selected.

  • afterQBEShow 

    Fires after the user has shown the QBE (Query by Example) row.

  • afterQuickSearch 

    Fires after the user has performed a Quick Search

  • afterRowCancelEdits 

    Fires after the user can cancelled edits on a Grid row.

  • afterRowCollapse 

    Fires after the user has collapsed a previously expanded row expander.

  • afterRowDelete 

    Fires after the user has deleted a record in a Grid by clicking the 'Delete Record' button in a Grid row.

  • afterRowExpand 

    Fires after the user has expanded a row expander.

  • afterRowPopulate 

    This event fires when a Grid row has been populated with data using the Grid's .populateRow() method. It can be used to set default values in new record rows in the Grid part. To see how this event can be used watch this video.

  • afterRowSubmit 

    Fires after the user has clicked the submit row button in a Grid row and the server has processed the request. The 'hasErrors' parameter is true if there were any errors when committing the data.

  • afterRowSwitchFromEditable 

    Fires if the Grid is set to 'Edit on Demand' and the user has switched from editable to not-editable mode.

  • afterRowSwitchToEditable 

    Fires if the Grid is set to 'Edit on Demand' and the user has switched to editable mode.

  • afterSearchClear 

    Fires after the user has cleared the Search part

  • afterSearchSubmit 

    Fires after the user has clicked the submit button on the Search part and the server has processed the request.

  • afterSearchSaved 

    Fires after the user saves the Search Part criteria.

  • afterSavedSearchLoaded 

    Fires after the user loads Search Part criteria that were previously saved.

  • afterSetRowsPerPage 

    Fires after the user has changed the number of records per page that the Grid shows.

  • afterSort 

    Fires after the user has sorted the records in the Grid by clicking on a Grid column title.

  • canAlphabetButtonSearch 

    Fires when the user tries to perform a Alphabet button search. If the event handler contains 'return false;', the event will be cancelled.

  • canDetailViewCancelEdits 

    Fires when the user tries to cancel edits in the Detail View. If the event handler contains 'return false;', the event will be cancelled.

  • canDetailViewClose 

    Fires when the user tries to close the Detail view. If the event handler contains 'return false;', the event will be cancelled.

  • canDetailViewDeleteRecord 

    Fires when the user tries to delete a record in the Detail View. If the event handler contains 'return false;', the event will be cancelled.

  • canDetailViewNewRecord 

    Fires when the user tries to enter a new record in the Detail View by clicking the 'Enter new record' icon or hyperlink. If the event handler contains 'return false;', the event will be cancelled (i.e. the new record row will not be shown).

  • canDetailViewOpen 

    Fires when the user tries to display the Detail View for a row in the Grid part. If the event handler contains 'return false;', the event will be cancelled.

  • canDetailViewSubmit 

    Fires when the user tries to submit edits made to a record in the Detail View. If the event handler contains 'return false;', the event will be cancelled.

  • canDetailViewSwitchFromEditable 

    Fires if the Detail View is set to 'edit on demand' and the user tries two switch from editable mode to non-editable mode. If the event handler contains 'return false;', the event will be cancelled.

  • canDetailViewSwitchToEditable 

    Fires if the Detail View is set to 'edit on demand' and the user tries two switch to editable mode. If the event handler contains 'return false;', the event will be cancelled.

  • canGridCancelEdits 

    Fires when the user tries to cancel edit made to the Detail View record.

  • canGridSubmit 

    Fires when the user tries to submit changes made to records in the Grid part by clicking the 'Submit' button for the entire Grid (not the submit button on individual Grid rows). If the event handler contains 'return false;', the event will be cancelled.

  • canOpenLookup 

    Fires when the user tries to open the Lookup Grid window. If the event handler contains 'return false;', the event will be cancelled.

  • canPageNavigate 

    Fires when the user tries to navigate to another page of records. If the event handler contains 'return false;', the event will be cancelled.

  • canQBEHide 

    Fires when the user tries to close the QBE row. If the event handler contains 'return false;', the event will be cancelled.

  • canQBESearch 

    Fires when the user tries to do a QBE search. If the event handler contains 'return false;', the event will be cancelled. The 'qbeType' parameter specifies the name of the option from the QBE menu that was selected.

  • canQBEShow 

    Fires when the user tries to show the QBE row (if it was previously hidden). If the event handler contains 'return false;', the event will be cancelled.

  • canQuickSearch 

    Fires when the user tries to perform a Quick Search. If the event handler contains 'return false;', the event will be cancelled.

  • canRowCancelEdits 

    Fires when the user tries to cancel edits made to an individual row in the Grid part. If the event handler contains 'return false;', the event will be cancelled.

  • canRowCollapse 

    Fires when the user tries to collapse a row that was previously expanded. If the event handler contains 'return false;', the event will be cancelled.

  • canRowDelete 

    Fires when the user tries to delete a row in the Grid part.

  • canRowExpand 

    Fires when the user tries to expand a row with a Row Expander icon. If the event handler contains 'return false;', the event will be cancelled.

  • canRowSubmit 

    Fires when the user tries to submit changes to an individual row in the Grid part. If the event handler contains 'return false;', the event will be cancelled.

  • canRowSwitchFromEditable 

    Fires if the Grid is set to 'edit on demand' and the user tries to swtich back to non-editable mode. If the event handler contains 'return false;', the event will be cancelled.

  • canRowSwitchToEditable 

    Fires if the Grid is set to 'edit on demand' and the user tries to editable mode. If the event handler contains 'return false;', the event will be cancelled. 'newRecordRowsVisible' - true/false depending on whether the new record rows are being shown.

  • canSearchClear 

    Fires when the user tries to clear the search criteria in the Search part. If the event handler contains 'return false;', the event will be cancelled.

  • canSearchSubmit 

    Fires when the user tries to perform a search by clicking the Search button in the Search part. Also fires if any control in the Search part is set to auto-submit (cascading dropdown controls can auto-submit). If the event handler contains 'return false;', the event will be cancelled.

  • canSetRowsPerPage 

    If the event handler contains 'return false;', the event will be cancelled.

  • canSort 

    Fires when the user tries to sort the Grid by clicking on a column title. If the event handler contains 'return false;', the event will be cancelled.

  • onDetailViewRender 

    Fires after the Detail View has been rendered.

  • onDetailViewStateChange 

    Fires when the Detail View state has changed. Possible states are 'view', 'change' and 'enter'.

  • onGridRefresh 

    Fires when a Grid has been refreshed.

  • onGridRender 

    Fires after all of the records in the Grid part have been rendered.

  • onNewRowsHide 

    Fires when the user has hidden the new records rows in the Grid part. (The Grid must have been set to only show new record rows on request).

  • onNewRowsShow 

    Fires when the user has shown the new records rows in the Grid part. (The Grid must have been set to only show new record rows on request).

  • canNewRowsShow 

    Fires when the user tries to shown the new records rows in the Grid part. (The Grid must have been set to only show new record rows on request). Function must return either true or false. If false, action is aborted. e.rowsInEditMode is the number of existing Grid rows that are currently in edit mode.

  • onObjectInitialize 

    Fires after the Grid object has been initialized. You use this event to override settings that are defined in the Grid object.

  • onRowBlur 

    Fires when a Grid row loses focus.

  • onRowFocus 

    Fires when a Grid row gets focus. Only fires if Grid is editable. See onRowSelect.

  • onRowSelect 

    Fires when a Grid row is selected. Fires when a row is selected for both read only and editable Grids.

  • onRowRefresh 

    Fires when a Grid row is refreshed.

  • onRowRender 

    Fires when a Grid row is rendered.

  • onRowStateChange 

    Fires when the state of a Grid Row has changed. Possible states are 'view', 'change' and 'enter'.

  • onGridStateChange 

    Fires when the state of the Grid Row has changed. 'isDirty' can be either true (if at least one row in the Grid is dirty), or false.

  • onSearchRender 

    Fires after the Search part has been rendered.

  • canLookupGridSelectRow 

    Fires before the user selects a row in a Lookup Grid. If the event handler contains 'return false;', the event will be cancelled.

  • afterLookupGridFillinValues 

    Fires after a record has been selected from a Lookup Grid and the values from the Lookup Grid have been filled into the Parent Grid.

  • onGridRowCheck 

    If the checkbox column for the Grid has been turned on, fires when the checkbox is checked, or unchecked.

  • onGridInitializeComplete 

    Fires after the Grid has been completely initialized and all HTML has been rendered. Does not fire on subsequent Ajax callbacks.

  • canNamedLayoutSelect 

    Fires when the user tries to change the named Layout (if multiple layout designs are enabled). If the event handler contains 'return false' the event will be cancelled and the layout will not be changed.

  • afterNamedLayoutSelect 

    Fires after the user has changed the current named Layout.

  • beforeAutoRefresh 

    Fires when an auto-refresh of the Grid occurs.

  • onGridRenderComplete 

    Very last event to fire after the Grid has been completely rendered and all system Javascript methods to initialize the Grid have fired. Contrast with onGridRender which fires before all system Javascript events have fired.

  • onImageError 

    Fires when an image in an element was not found. The e object passed in has an 'element' property. To get the id of the image tag refer to 'e.element.id'. To set the src of the image tag, set the 'e.element.src' property.

  • beforeHTMLReportExport 

    Fires when a user clicks on a toolbar button to export an HTML report to PDF, Excel, Word or text. You can use this event to put up a custom 'working...' message. To dismiss the custom message you can add code to the 'afterAjaxCallbackComplete' event.

  • webSocketOnMessage 

    Fires when a web-socket server message is received. The message contents is in the e.message parameter.

  • webSocketServerClose 

    Fires when the web-socket server is closed.