使用sapui5在DropDown框中填充数据

时间:2016-01-27 06:31:06

标签: json sapui5

var oItemsData = {
          items: [
            {"key" : "City1", "text" : "India"}, 
            {"key" : "City2", "text" : "America"}, 
            {"key" : "City3", "text" : "Germany"}, 
            {"key" : "City4", "text" : "France"}
          ]
        };

var oItemsModel = new sap.ui.model.json.JSONModel(oItemsData);
sap.ui.getCore().setModel(oItemsModel, "items");
new sap.ui.commons.Label({text:"FirstOne"}),
                    new sap.ui.commons.DropdownBox({value:"",required: true,
                        items: { 
                            path: "items>/items",
                            template: new sap.ui.core.ListItem({
                              text: { path: "items>text" }//how to filter
                            }) 
                          }
                    }),
                    new sap.ui.commons.Label({text:"SecondOne"}),
                    new sap.ui.commons.DropdownBox({value:"",required: true,
                        items: { 
                            //populate on the basis of 1st one's input
                            }) 
                          }
                    })

这对上面的json数据工作正常。

但是当我的json数据如下所示时,我遇到了问题:

{
  "CountryList" : [
      {
        "key" : "City1", "text" : "India"
      }, {
        "key" : "City2", "text" : "America"
      }, {
        "key" : "City3", "text" : "Germany"
      }, {
        "key" : "City4", "text" : "France"
      }
  ]
}

我尝试了以下代码:

var oItemsModel = new sap.ui.model.json.JSONModel();
oItemsModel.loadData("json/countryList.json");
sap.ui.getCore().setModel(oItemsModel, "CountryList");

new sap.ui.commons.DropdownBox("Cities", {
                selectedItemId : "{CountryList>/CountryList/0/callingfrom}", 
                items: {        
                  path: "items>/CountryList",
                  template: new sap.ui.core.ListItem({
                    key: {path: "items>key"},
                    text: {path: "items>text"}
                  }) 
                },
              })

但不行。

如何在上面的Json格式下在下拉框中构建数据。

2 个答案:

答案 0 :(得分:0)

我在这里猜测,但你所做的就是改变聚合名称来自" items"到" CountryList"

因此请尝试引用新名称

new sap.ui.commons.DropdownBox({value:"",required: true,
   items: { 
          path: "items>/CountryList",  // >> here
          template: new sap.ui.core.ListItem({
          text: { path: "items>text" }//how to filter
       }) 
   }
}),

答案 1 :(得分:0)

解决上述问题:

var oItemsModel = new sap.ui.model.json.JSONModel();
oItemsModel.loadData("json/countryList.json");
sap.ui.getCore().setModel(oItemsModel, "CountryList");

new sap.ui.commons.DropdownBox("Cities", {
            selectedItemId : "{CountryList>/CountryList/0/callingfrom}", 
           items: {        
                  path: "CountryList>/CountryList",
                  template: new sap.ui.core.ListItem({
                    key: {path: "CountryList>key"},
                    text: {path: "CountryList>text"}
                  }) 
                },
              })