Your event handler sets the selectedActivity and selectedItem observables when the user makes a list selection and the value of the selected attribute changes. The Oracle JET List View component defines a selected attribute, on which the Oracle JET List View API defines a property change listener.
#ORACLE JET CALENDAR UPDATE#
Update the viewModel to add event handlers for the List View components to respond to selections in the Activities list and the Activity Items list.
Task 2: Create Event Handlers in the ViewModel Your file should look similar to event-task1-dashboard-html.txt. Navigate to the JET_Web_Application/src/ts/views directory and open the dashboard.html file in an editor.īelow the Activities heading, find the oj-list-view custom HTML element where id="activitiesList", and then add the selection behavior attributes after the em attribute. Use the component’s on-selection-changed attribute to catch and process list selection/deselection events by binding an event listener that you define in the viewModel. The Oracle JET List View component defines the first-selected-item attribute that the component populates with the data items of the user’s row selection and that you can read into an observable by using a two-way binding. Update the view to customize the List View components to handle a row selection in the Activities list and Activity Items list. Task 1: Set Selection Behavior in the View
#ORACLE JET CALENDAR HOW TO#
You also learn how to use an Oracle JET If Binding component to conditionally display the detail list to handle list selections. You learn how to create a JavaScript event handler by using an Oracle JET property change listener. In this tutorial, you will update the user interface of an Oracle JET web app so that you can display master-detail data. If the selected attribute is empty due to a deselection event, then the variable is set to false, and the view renders a container in the view without the databound detail list. If the selected attribute of the Oracle JET List View component for the master list isn’t empty, then the variable is set to true, and the view renders the databound detail list.
The event handler can also set the boolean variable that the Oracle JET If Binding component uses to conditionally render its nested HTML elements in the view.
You can use the event handler to populate the Oracle JET data provider, and you can bind the data provider to observables that the view component can use. When the user selects or deselects an item in the list, the change listener triggers your event handler. You can use the Oracle JavaScript Extension Toolkit (Oracle JET) API in the viewModel of the Oracle JET web app to create event handlers that respond to the Oracle JET List View component selected attribute change listener. Handle selection events in an Oracle JET web app Introduction JavaScript must be enabled to correctly display this content
0 kommentar(er)
