动态创建Ext.panel

时间:2017-10-24 09:41:52

标签: javascript extjs

在我的应用程序中,我在Json中收到了一些对象。我想创建一个显示单个对象的面板。如果我收到2个对象,请创建包含其内容的2个面板,如果我收到100:100个面板。

我尝试使用for .add.doLayout,但从不显示任何面板。在我的控制台中显示了面板的创建,但从未渲染到我的主要面板container中。我做错了什么?

那是我的代码:

success : function(response) {
    var jsonResp = Ext.util.JSON
            .decode(response.responseText);
    //              Ext.Msg.alert("Info", "UserName from Server : " + jsonResp.message);

    // Limpiamos el array para tener solo las propiedades que se usarán
    jsonResp.forEach(function(currentItem) {
        delete currentItem["cls"];
        delete currentItem["estandar"];
        delete currentItem["iconCls"];
        delete currentItem["leaf"];
        delete currentItem["objetivo"];
        delete currentItem["observaciones"];
        delete currentItem["porcentaje"];
        delete currentItem["salvaguardas"];
        delete currentItem["tieneDocs"];
        delete currentItem["tipoNombre"];
        delete currentItem["responsable"];
        delete currentItem["responsableId"];
        delete currentItem["idReal"];
        delete currentItem["tipoNombre"];
        delete currentItem["tipo"];
        delete currentItem["calculado"];
        delete currentItem["text"];
    });
    var children = [];
    console.log(jsonResp);
    var sumarvariable = 0;
    //add children to panel at once
    for ( var i in jsonResp) {
        if (i < jsonResp)
            var panel = new Ext.Panel({
                id : 'pregunta' + sumarvariable,
                html : sumarvariable

            })
        console.log(panel)
        Ext.getCmp("contenedor").add(panel);
        Ext.getCmp("contenedor").doLayout();
        sumarvariable++;
    }
},

1 个答案:

答案 0 :(得分:0)

根据您的第二条评论,在您的.forEach中更改并使用jsonResp.forEach之类的 //Create Panel with every object var i = 0; jsonResp.forEach(function(currentItem) { i++; var panel = new Ext.Panel({ id: 'jsonObject' + i, html: 'Object' + i }) //Add to your object "contenedor" Ext.getCmp("contenedor").add(panel); }); //Force reload and shows every panel Ext.getCmp("contenedor").doLayout(); 。此代码创建一个面板并将其添加到&#34; contenedor&#34;。

    var CallUsLabel = new Label { Text = "Tap or click here to call" };
    CallUsLabel.GestureRecognizers.Add(new TapGestureRecognizer { Command = new Command(() => {
           Device.OpenUri(new Uri("tel:038773729"));
        }) });