Extension Points and Source Code Customization : General view events
  

General view events

Events allow you to specify the name of a JavaScript function that runs when a specified event fires. General view events fire based on behaviors that are common to all views. The function that runs for an event are defined in either the controller.public.js or router-events.js file for the view, depending on the event. These files can be found for each view at the following location, and initially contains empty function definitions for these events with default names:
webAppDir\app\src\modules\module-folder\view-folder\
For more information on these files and its location, see Custom code.
The following table describes the supported general view events, the default names of the event functions that run for them when they fire, and the view static file location where they reside.
Table 7. Default general view event functions
View event
Default function
View static file
Description
Hide
onHide
router-events.js
Fires when the view is hidden. You can find more information at http://docs.telerik.com/kendo-ui/api/javascript/view#events-hide.
Init
onInit
router-events.js
Fires when the view is initialized. You can find more information at http://docs.telerik.com/kendo-ui/api/javascript/view#events-init.
Show
onShow
controller.public.js
Fires when the view is made visible. You can find more information at http://docs.telerik.com/kendo-ui/api/javascript/view#events-show.
You can change the default names of these functions in its view static file for a view. One reason to change an event function name is to test alternative event behaviors using different event functions before deciding on the one you want to implement for the web app. If you do need to change the default name of a view event function in the file, you must also change the name of the event function as specified for the corresponding view in the Kendo UI Designer.
For the general view events, these function names are specified in the Edit View dialog box, which you can access in the Designer as follows:
1. Edit the view by first editing its module in the app design page (see Creating and designing an app). This displays the view design page for the first view in the module and lists all its remaining views (for the example Data-Grid view, see Adding and editing a Data-Grid view).
2. Select the name of the view in the list you want to edit, displaying its view design page. This shows a gear control beside the selected view name, as shown for the customer_list view:
Figure 45. Editing general view events
KUIB_View_Gear_Control_HTML.png
3. Click the gear control to display a drop-down menu, then click Edit:
Figure 46. Opening the Edit View dialog box
KUIB_View_Gear_Control_Edit_HTML.png
4. This opens the Edit View dialog box, where you can change the name of any general view event function by editing the field for the event as shown:
Figure 47. Changing the names of general view event functions
KUIB_Edit_View_Dialog_HTML.png
5. Click Save to save your changes and close the dialog box.