SAPUI5-如何将数据绑定到sap.ui.layout.form?

时间:2014-01-23 16:35:30

标签: sapui5

如何将json数据绑定到form.Below是我要绑定的表单和数据。     请帮我解决一下这个。     示例我想将111个对象值绑定到表单

Data:
{"customerdetailsjson": {
        "111": [
            {
                "name": "Bhuvaneswari Krishnan",
               "phone-number":"8050231233"
            }
        ],
        "112": [
            {
                 "name":"Chetan Sandeep Renu",
       "phone-number":"9840321321"
            }
        ]
    }}

Form:
var oLayout1 = new sap.ui.layout.form.ResponsiveGridLayout();
customerDetailsForm = new sap.ui.layout.form.Form("F1", {
layout: oLayout1,
formContainers: [new sap.ui.layout.form.FormContainer("F1C2", {
    title: new sap.ui.core.Title({
        text: "Address Information",
        tooltip: "Address data"
    }),
    formElements: [new sap.ui.layout.form.FormElement({
        label: "Street / Number",
        fields: [new sap.m.Input({
            type: sap.m.InputType.Text,
            value: "{name}",
            layoutData: new sap.ui.core.VariantLayoutData({
                multipleLayoutData: [new sap.ui.layout.ResponsiveFlowLayoutData({
                    weight: 5
                }), new sap.ui.layout.form.GridElementData({
                    hCells: "5"
                })]
            })
        })]
    }), new sap.ui.layout.form.FormElement({
        label: "Street / Number",
        fields: [new sap.m.Input({
            type: sap.m.InputType.Text,
            value: "{phone-number}",
            layoutData: new sap.ui.core.VariantLayoutData({
                multipleLayoutData: [new sap.ui.layout.ResponsiveFlowLayoutData({
                    weight: 5
                }), new sap.ui.layout.form.GridElementData({
                    hCells: "5"
                })]
            })
        })]
    })]
})]
})]

1 个答案:

答案 0 :(得分:7)

首先,您需要一个模型:

var myModel = new sap.ui.model.json.JSONModel(myJsonData);

然后将其分配给您的控件:

customerDetailsForm.setModel(myModel);

现在,您可以使用模型根节点的绝对路径,将模型中的值绑定到控件(以及子控件):

    ...
    new sap.ui.layout.form.FormElement({
            label: "Street / Number",
            fields: [new sap.m.Input({
                type: sap.m.InputType.Text,
                value: "{/customerdetailsjson/111/0/name}",
                layoutData: new sap.ui.core.VariantLayoutData({
                    multipleLayoutData: [new sap.ui.layout.ResponsiveFlowLayoutData({
                        weight: 5
                    }), new sap.ui.layout.form.GridElementData({
                        hCells: "5"
                    })]
                })
            })]
   ...

GL 克里斯