AEM:尝试在其他对话框中重用现有图像对话框。使用cqinclude包含图像对话框时,选项卡中的选项卡不工作

AEM:尝试在其他对话框中重用现有图像对话框。使用cqinclude包含图像对话框时,选项卡中的选项卡不工作,aem,xtype,Aem,Xtype,我有一个具有多个选项卡的对话框的组件。一些选项卡是xtype=“HTML5MartImage”的小部件,用于接受图像,其他选项卡用于接受不同的图像参数 我将对话框分为两部分,以使选项卡系统可供其他组件重用。下面是: 图像组件 tab\u image\u information.xml 在dialog.xml中,我做了: 这个组件本身工作得很好 现在我需要编写另一个组件(myComponent),它的对话框将有两个选项卡-一个用于基本信息,另一个选项卡将显示 具有ImageComponen

我有一个具有多个选项卡的对话框的组件。一些选项卡是xtype=“HTML5MartImage”的小部件,用于接受图像,其他选项卡用于接受不同的图像参数

我将对话框分为两部分,以使选项卡系统可供其他组件重用。下面是:

图像组件 tab\u image\u information.xml

在dialog.xml中,我做了:

这个组件本身工作得很好

现在我需要编写另一个组件(myComponent),它的对话框将有两个选项卡-一个用于基本信息,另一个选项卡将显示 具有ImageComponent的功能。所以我尝试使用infinity.json包含tab_image_信息。下面是myComponent:

myComponent 选项卡基本信息.xml

而dialog.xml类似于:

在myComponent对话框中包含tab_image_信息,但布局不正确,也没有保存该选项卡的信息(componentImageSelection)


非常感谢您的任何建议。

您的选项卡图像信息是正确的,并且是cq:TabPanel类型,而其他选项卡基本信息是cq:Panel类型,请尝试使用cq:TabPanel。我认为这应该解决布局问题,这只是我的初步猜测,最好添加屏幕截图,以更好地了解什么是确切的布局问题。在保存部分,JCR中保存了什么?发布数据时,即完成配置后,请参阅“网络中的请求”选项卡,然后单击“确定”。在JCR中存储数据的另一种方法是创建自定义servlet来发布数据,而不是使用OOTB。希望这有帮助。还可以用extjs标记您的问题,这对布局问题非常有帮助

<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
    jcr:primaryType="cq:TabPanel"
    activeTab="0"
    xtype="tabpanel">
    <items jcr:primaryType="cq:WidgetCollection">
        <imageTab1 jcr:primaryType="cq:Widget"
            itemId="imageTab1"
            cropParameter="./image1/imageCrop"
            ddGroups="[media]"
            fileNameParameter="./image1/fileName"
            fileReferenceParameter="./image1/fileReference"
            blankText="An image is required"
            name="./image1/file"
            requestSuffix="/image1.img.png"
            rotateParameter="./image1/imageRotate"
            sizeLimit="100"
            height="250"
            title="Desktop Image"
            uploadUrl="/tmp/upload/*"
            xtype="html5smartimage" />
        <imageTab2 jcr:primaryType="cq:Widget"
            itemId="imageTab2"
            cropParameter="./image2/imageCrop"
            ddGroups="[media]"
            fileNameParameter="./image2/fileName"
            fileReferenceParameter="./image2/fileReference"
            blankText="An image is required"
            name="./image2/file"
            requestSuffix="/image2.img.png"
            rotateParameter="./image2/imageRotate"
            sizeLimit="100"
            height="250"
            title="Tablet Image"
            uploadUrl="/tmp/upload/*"
            xtype="html5smartimage" />        
        <imageDetails jcr:primaryType="cq:Widget"
            title="Image Details"
            height="250"
            xtype="panel">
            <items jcr:primaryType="cq:WidgetCollection">
                <displayWidth jcr:primaryType="cq:Widget"
                    fieldDescription="Set display width for the image."
                    fieldLabel="Display Width"
                    name="./displayWidth"
                    xtype="textfield"/>
                <displayHeight jcr:primaryType="cq:Widget"
                    fieldDescription="Set display height for the image."
                    fieldLabel="Display Height"
                    name="./displayHeight"
                    xtype="textfield"/>
                <image1ResType jcr:primaryType="cq:Widget"
                    ignoreData="{Boolean}true"
                    name="./image1/sling:resourceType"
                    value="foundation/components/image"
                    xtype="hidden" />
                <image2ResType jcr:primaryType="cq:Widget"
                    ignoreData="{Boolean}true"
                    name="./image2/sling:resourceType"
                    value="foundation/components/image"
                    xtype="hidden" />
            </items>
        </imageDetails>
    </items>
</jcr:root>
<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
    jcr:primaryType="cq:Dialog"
    title="Image Selection"
    xtype="dialog">
    <items jcr:primaryType="cq:WidgetCollection">
        <imageSelection jcr:primaryType="cq:Widget"
            path="/apps/myproject/components/content/imageComponent/tab_image_information.infinity.json"
            xtype="cqinclude"/>
    </items>
</jcr:root>
<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
    jcr:primaryType="cq:Panel"
    title="Component Information"
    width="500">
    <items jcr:primaryType="cq:WidgetCollection">
        <text1 jcr:primaryType="cq:Widget"
            fieldLabel="Headline"
            name="./text1"
            xtype="textfield"
            maxlength="42"/>
        <text2 jcr:primaryType="cq:Widget"
            fieldLabel="Sub head"
            name="./text2"
            xtype="textfield"
            maxlength="42"/>
    </items>
</jcr:root>
<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
    jcr:primaryType="cq:Dialog"
    title="My Component"
    xtype="dialog">
    <items jcr:primaryType="cq:WidgetCollection">
        <tabs jcr:primaryType="cq:TabPanel">
            <items jcr:primaryType="cq:WidgetCollection">
                <componentInformation
                    jcr:primaryType="cq:Widget"
                    path="/apps/myproject/components/content/myComponent/tab_basic_information.infinity.json"
                    xtype="cqinclude"/>
                <componentImageSelection
                    jcr:primaryType="cq:Widget"
                    title="Component Image Selection"
                    xtype="panel"
                    width="500">
                    <items jcr:primaryType="cq:WidgetCollection">                        
                        <imageSelection
                            jcr:primaryType="cq:Widget"
                            path="/apps/myproject/components/content/imageComponent/tab_image_information.infinity.json"
                            xtype="cqinclude"/>
                    </items>
                </componentImageSelection>
            </items>
        </tabs>
    </items>
</jcr:root>