Modx隐藏特定选项卡中的内容字段

时间:2015-10-12 10:55:45

标签: javascript extjs modx modx-revolution

Modx revo最新版本

我需要隐藏我使用表单自定义创建的特定选项卡中的内容字段,我发现这个Ext JS代码但我不知道如何实现它。它是ondocformrender的插件吗?我应该创建一个js文件吗?

Ext.onReady(function(){
var tabPanel = Ext.getCmp("modx-resource-tabs");

if(tabPanel!=null){
    //Add my custom tab
    var customTab = {
        title: 'Custom',
        id: 'my-custom-tab',
        cls: 'modx-resource-tab',
        layout: 'fit',
        labelAlign: 'top',
        labelSeparator: '',
        bodyCssClass: 'tab-panel-wrapper main-wrapper',
        autoHeight: true,
        defaults: {
            border: false,
            msgTarget: 'under',
            width: 400,
            height:800
        },
        items: [
            {
                xtype: "box",
                autoEl: {cn: '<div id="target_id"></div>'}
            }
        ]
    };
    tabPanel.on('tabchange', function(parent,selectedTab){ 
        if (selectedTab.id == 'my-custom-tab') {
            Ext.getCmp("modx-resource-content").hide();
        }
        else {
            Ext.getCmp("modx-resource-content").show();
        }
    });
    tabPanel.insert(0, customTab);
    tabPanel.setActiveTab(0);
    tabPanel.doLayout();
}
});

2 个答案:

答案 0 :(得分:1)

您无需编辑任何ExtJS,您可以通过MODX的Manager Customization功能执行此操作。

请参阅随附的屏幕截图以供参考。

MODX Manager Customization

答案 1 :(得分:1)

我在OnDocFormPrerender上做了一个这样的插件:

<?php
switch ($modx->event->name) {
// Add a custom tab to the MODX create/edit resource pages
case 'OnDocFormPrerender':
    $custom_html = 'Your custom HTML, e.g. from a model function or API         lookup etc.';
    $modx->regClientStartupHTMLBlock('<script type="text/javascript">
        Ext.onReady(function(){
var tabPanel = Ext.getCmp("modx-resource-tabs");

if(tabPanel!=null){
    tabPanel.on(\'tabchange\', function(parent,selectedTab){ 
        if (selectedTab.id == \'modx-ref\') {
            Ext.getCmp("modx-resource-content").hide();
        }
        else {
            Ext.getCmp("modx-resource-content").show();
        }
    });
    tabPanel.insert(0, customTab);
    tabPanel.setActiveTab(0);
    tabPanel.doLayout();
}
});               
    </script>');
}