Multilevel select - Mobile Platform as a Service - Alibaba Cloud Documentation Center

my.multiLevelSelect(Object)

Note: This interface is only supported in mPaaS 10.1.32 and later versions.

Cascaded selection is mainly used for selecting several levels of associated data, such as province, city and district.

Input parameters

Parameter	Type	Required	Description
title	String	No	Title
list	JsonArray	Yes	Selection data list
success	Function	No	Callback function upon call success.
fail	Function	No	Callback function upon call failure.
complete	Function	No	Callback function upon call completion (to be executed upon either call success or failure).

list objects

Parameter	Type	Required	Description
name	String	Yes	Entry name
subList	JsonArray	No	Sub-entry list.

Output parameters

Parameter	Type	Description
success	Boolean	Selection completed or not, returning false for cancellation.
result	JsonArray	Selection result, for example, [{“name”:”Hangzhou”},{“name”:”Xihu District”},{“name”:”Gucui Subdistrict”}].

Code sample

// API-DEMO page/API/multi-level-select/multi-level-select.json
{
     "defaultTitle": "cascaded selector"
}

<!-- API-DEMO page/API/multi-level-select/multi-level-select.axml-->
<view class="page">
  <view class="page-description">cascaded selector API</view>
  <view class="page-section">
    <view class="page-section-title">my.multiLevelSelect</view>
    <view class="page-section-demo">
      <button type="primary" onTap="openMultiLevelSelect">cascaded selector</button>
    </view>
  </view>
</view>

// API-DEMO page/API/multi-level-select/multi-level-select.js
Page({
  openMultiLevelSelect() {
    my.multiLevelSelect({
        title: 'cascaded selector',//Title for cascaded selection
        list: [
        {
            name: "Hangzhou",//Entry name
            subList: [
                {
                    name: "Xihu District",
                    subList: [
                        {
                            name: "Gucui Subdistrict"
                        },
                        {
                            name: "Wenxin Subdistrict "
                        }
                    ]
                },
                {
                    name: "Shangcheng District",
                    subList: [
                        {
                            name: "Yan'an Subdistrict"
                        },
                        {
                            name: "Longxiangqiao Subdistrict"
                        }
                    ]
                }
            ]//sub-level data list
        }],//data list
        success:(res)=>{
            my.alert({title:JSON.stringify(res)})
        }
    });
  }
})