Skip to main content

Example of Parameter Passing for Data List

Data List and Pop-up Component Content Linkage​

Scenario 1: In the data list, clicking a row triggers a pop-up that displays the current row's data. Clicking the OK button in the pop-up passes the content to a custom js method.

  1. Using Data List and Pop-up Component in the Editor

  2. Set up the click event for the data list row, selecting the current row's data $w.item_listView1 as the parameter

  3. In the pop-up, this example demonstrates displaying the current row's field _openid, where $w.modal1.openInfo is used to receive the row data passed from the previous step.

  4. Set the pop-up default open state to closed

  5. Clicking a data table row triggers the pop-up opening event. You can see the pop-up opens successfully and displays the _openid data of the current row.

  6. Configure a click event for the Confirm button in the pop-up to call the js method function1 and pass the parameter $w.modal1.openInfo

  7. Print the input parameter data.target in the js method function1

  8. View the print output of the above method in browser debugging mode

Data List Navigation to Details Page​

Scenario 2: In the data list, clicking a row triggers navigation to the details page.

  1. Configure the business data model for the data list component

  2. Configure a page navigation event in the data list row data, passing the current row's data identifier $w.item_listView1._id as the parameter 'id' to the target page

  3. On the target page, use the data details component to configure the business data model. In the data filter conditions, select data identifier equal to $w.page.dataset.params.id