如何同时更改两个多视图?

时间:2014-05-18 21:37:49

标签: tabbar dhtmlx multiview multiviews

好的,首先让我先解释一下我的内容。

我有一个Segmented控件作为我的Tab-bar控件。这会根据选择的段(选项卡)更改页面内容。 页面内容分为左右列。每列都有自己的Multiview。

现在问题在于我只能在更改细分(标签)时更改其中一个多视图。

 _______________
|  ___ ___ ___  |
| (_1_|_2_|_3_) |  /* segments or tabs */
|   ____ _____  |
|  |left|right| |  /* two columns that must change */
|  |~~~ |~~~  | |
|  |~~~ |~~~  | |
|  |~~~ |     | |
|  |____|_____| |
|_______________|

这是我的一些代码,我正在使用dhtmlx touch

{
container:"content",
type:"clean",
css:"page",
rows:[
    {
        view:"toolbar",
        elements:[
            {view:"segmented", width:320, inputWidth: 280, multiview: true, selected:"cos_301", align:"center", options: [   
                { label: 'COS 301', value: "cos_301"},
                { label: 'COS 333', value: "cos_333"},
                { label: 'COS 364', value: "cos_364"}
            ]}
        ]
    },
    {cols:[
        {view:"label", label:"Announcements"},
        {view:"label", label:"Pracs"}
    ]},
    {cols:[
        {view:"multiview", width:200, height: 290, 
            cells:[    
                { template:"some info", scrol: true, id:"cos_301" },
                { template:"some info", scrol: true, id:"cos_333" },
                { template:"some info", scroll: true, id:"cos_364" }
            ]
        },
        {view:"multiview", width:100, height: 290, 
            cells:[    
                { template:"some info", scrol: true, id:"cos_301p" },
                    { template:"some info", scrol: true, id:"cos_333p" },
                    { template:"some info", scrol: true, id:"cos_364p" }
                ]}
    ]}
    ]
}

/ 这显示正确,它只是不想更改 /

1 个答案:

答案 0 :(得分:0)

您可以尝试设置onBeforeTabClick处理程序以在选项卡单击上显示多个视图(在这种情况下,您可以从配置中删除“multiview:true”):

dhx.ui({
...
{view:"segmented", id: "tabs", ...}
...
});

$$("tabs").attachEvent("onBeforeTabClick", function(button, id) {
   // show the view in the first column
   $$(id).show();
   // and the second column
   $$(id+"p").show();
   return true;
});