How to open component dialog through Javascript in Touch UI AEM/Adobe CQ5


1) You need to get the editable of the component which you want to open dialog

var cmpEditables = Granite.author.store.find("<component content node path");

var cmp = cmpEditables[0];


2)Pass the editable to the execute method

Granite.author.EditorFrame.editableToolbar.config.actions.CONFIGURE.execute(cmp);
2 comments:

How to refresh component through Javascript in Touch UI AEM/Adobe CQ5


How to refresh component through Javascript in Touch UI


All the editable will store at Granite.author.store

 You can find editables for you component by using find method

var cmpEditables = Granite.author.store.find("<component content node path"); <!-- return array of editables -->

 var cmp = cmpEditables[0];<!-- get you component editable -->

 cmp.refresh(); <!-- refresh you component--->


Or to refresh you can also use

Granite.author.editableHelper.doRefresh(cmp)
2 comments:

How to add rtePlugins for Touch UI Rich Text in Dialog / Inplace Edit In AEM 6.2

Rich Text rtePlugins configurations for the inplace edit

<rtePlugins jcr:primaryType="nt:unstructured">
        <format
            jcr:primaryType="nt:unstructured"
            features="*"/>
        <justify
            jcr:primaryType="nt:unstructured"
            features="*"/>
        <lists
            jcr:primaryType="nt:unstructured"
            features="*"/>
        <links
            jcr:primaryType="nt:unstructured"
            features="*"/>
        <subsuperscript
            jcr:primaryType="nt:unstructured"
            features="*"/>
        <paraformat
            jcr:primaryType="nt:unstructured"
            features="*">
            <formats jcr:primaryType="cq:WidgetCollection">
                <paragraph
                    jcr:primaryType="cq:WidgetCollection"
                    description="Paragraph"
                    tag="p"/>
                <heading1
                    jcr:primaryType="cq:WidgetCollection"
                    description="Heading 1"
                    tag="h1"/>
                <heading2
                    jcr:primaryType="cq:WidgetCollection"
                    description="Heading 2"
                    tag="h2"/>
                <heading3
                    jcr:primaryType="cq:WidgetCollection"
                    description="Heading 3"
                    tag="h3"/>
                <heading4
                    jcr:primaryType="cq:WidgetCollection"
                    description="Heading 4"
                    tag="h4"/>
                <strong
                    jcr:primaryType="nt:unstructured"
                    description="Strong"
                    tag="strong"/>
                <em
                    jcr:primaryType="nt:unstructured"
                    description="Em"
                    tag="em"/>
                <i
                    jcr:primaryType="nt:unstructured"
                    description="I (ai)"
                    tag="i"/>
            </formats>
        </paraformat>
        <styles
            jcr:primaryType="nt:unstructured"
            features="*">
            <styles jcr:primaryType="cq:WidgetCollection">
                <fa-map-marker
                    jcr:primaryType="nt:unstructured"
                    cssName="fa fa-map-marker"
                    text="Font Awesome Map Marker"/>
            </styles>
        </styles>
        <edit
            jcr:primaryType="nt:unstructured"
            features="*"/>
        <findreplace
            jcr:primaryType="nt:unstructured"
            features="*"/>
        <undo
            jcr:primaryType="nt:unstructured"
            features="*"/>
        <spellcheck
            jcr:primaryType="nt:unstructured"
            features="*"/>
        <table
            jcr:primaryType="nt:unstructured"
            features="*"/>
        <fullscreen
            jcr:primaryType="nt:unstructured"
            features="*"/>
        <misctools
            jcr:primaryType="nt:unstructured"
            features="*"/>
    </rtePlugins>
    <uiSettings jcr:primaryType="nt:unstructured">
        <cui jcr:primaryType="nt:unstructured">
            <inline
                jcr:primaryType="nt:unstructured"
                toolbar="[#format,-,#justify,-,#lists,-,links#modifylink,links#unlink,links#anchor,-,subsuperscript#superscript,subsuperscript#subscript,-,#paraformat,#styles,-,misctools#sourceedit,-,fullscreen#start,-,control#close,control#save]">
                <popovers jcr:primaryType="nt:unstructured">
                    <format
                        jcr:primaryType="nt:unstructured"
                        items="[format#bold,format#italic,format#underline]"
                        ref="format"/>
                    <justify
                        jcr:primaryType="nt:unstructured"
                        items="[justify#justifyleft,justify#justifycenter,justify#justifyright]"
                        ref="justify"/>
                    <lists
                        jcr:primaryType="nt:unstructured"
                        items="[lists#unordered,lists#ordered,lists#outdent,lists#indent]"
                        ref="lists"/>
                    <paraformat
                        jcr:primaryType="nt:unstructured"
                        items="paraformat:getFormats:paraformat-pulldown"
                        ref="paraformat"/>
                    <styles
                        jcr:primaryType="nt:unstructured"
                        items="styles:getStyles:styles-pulldown"
                        ref="styles"/>
                </popovers>
            </inline>
            <tableEditOptions
                jcr:primaryType="nt:unstructured"
                toolbar="[table#insertcolumn-before,table#insertcolumn-after,table#removecolumn,-,table#insertrow-before,table#insertrow-after,table#removerow,-,   table#mergecells-right,table#mergecells-down,table#mergecells,table#splitcell-horizontal,table#splitcell-vertical,-,table#selectrow,   table#selectcolumn,-,table#ensureparagraph,-,table#modifytableandcell,table#removetable,-,undo#undo,undo#redo,-,table#exitTableEditing]"/>
            <fullscreen
                jcr:primaryType="nt:unstructured"
                toolbar="[#format,-,#justify,-,#lists,-,links#modifylink,links#unlink,links#anchor,-,subsuperscript#superscript,subsuperscript#subscript,-,#styles,#paraformat,-,edit#cut,edit#copy,edit#paste-plaintext,edit#paste-default,edit#paste-wordhtml,-,undo#undo,undo#redo,-,findreplace#find,findreplace#replace,-,spellcheck#checktext,-,misctools#sourceedit,-,table#createoredit,-,fullscreen#start,-,control#close,control#save]">
                <popovers jcr:primaryType="nt:unstructured">
                    <format
                        jcr:primaryType="nt:unstructured"
                        items="[format#bold,format#italic,format#underline]"
                        ref="format"/>
                    <justify
                        jcr:primaryType="nt:unstructured"
                        items="[justify#justifyleft,justify#justifycenter,justify#justifyright]"
                        ref="justify"/>
                    <lists
                        jcr:primaryType="nt:unstructured"
                        items="[lists#unordered,lists#ordered,lists#outdent,lists#indent]"
                        ref="lists"/>
                    <paraformat
                        jcr:primaryType="nt:unstructured"
                        items="paraformat:getFormats:paraformat-pulldown"
                        ref="paraformat"/>
                    <styles
                        jcr:primaryType="nt:unstructured"
                        items="styles:getStyles:styles-pulldown"
                        ref="styles"/>
                </popovers>
            </fullscreen>
        </cui>
    </uiSettings>

Rich Text rtePlugins configurations for the dialog

<rte-in-dialog
                    jcr:primaryType="nt:unstructured"
                    sling:resourceType="cq/gui/components/authoring/dialog/richtext"
                    fieldLabel="Footer right"
                    name="./footerRight"
                    useFixedInlineToolbar="{Boolean}true">
                    <rtePlugins jcr:primaryType="nt:unstructured">
                        <format
                            jcr:primaryType="nt:unstructured"
                            features="*"/>
                        <justify
                            jcr:primaryType="nt:unstructured"
                            features="*"/>
                        <lists
                            jcr:primaryType="nt:unstructured"
                            features="*"/>
                        <links
                            jcr:primaryType="nt:unstructured"
                            features="*"/>
                        <subsuperscript
                            jcr:primaryType="nt:unstructured"
                            features="*"/>
                        <paraformat
                            jcr:primaryType="nt:unstructured"
                            features="*">
                            <formats jcr:primaryType="cq:WidgetCollection">
                                <paragraph
                                    jcr:primaryType="cq:WidgetCollection"
                                    description="Paragraph"
                                    tag="p"/>
                                <heading1
                                    jcr:primaryType="cq:WidgetCollection"
                                    description="Heading 1"
                                    tag="h1"/>
                                <heading2
                                    jcr:primaryType="cq:WidgetCollection"
                                    description="Heading 2"
                                    tag="h2"/>
                                <heading3
                                    jcr:primaryType="cq:WidgetCollection"
                                    description="Heading 3"
                                    tag="h3"/>
                                <heading4
                                    jcr:primaryType="cq:WidgetCollection"
                                    description="Heading 4"
                                    tag="h4"/>
                                <strong
                                    jcr:primaryType="nt:unstructured"
                                    description="Strong"
                                    tag="strong"/>
                                <em
                                    jcr:primaryType="nt:unstructured"
                                    description="Em"
                                    tag="em"/>
                                <i
                                    jcr:primaryType="nt:unstructured"
                                    description="I (ai)"
                                    tag="i"/>
                            </formats>
                        </paraformat>
                        <styles
                            jcr:primaryType="nt:unstructured"
                            features="*">
                            <styles jcr:primaryType="cq:WidgetCollection">
                                <fa-map-marker
                                    jcr:primaryType="nt:unstructured"
                                    cssName="fa fa-map-marker"
                                    text="Font Awesome Map Marker"/>
                            </styles>
                        </styles>
                        <edit
                            jcr:primaryType="nt:unstructured"
                            features="*"/>
                        <findreplace
                            jcr:primaryType="nt:unstructured"
                            features="*"/>
                        <undo
                            jcr:primaryType="nt:unstructured"
                            features="*"/>
                        <spellcheck
                            jcr:primaryType="nt:unstructured"
                            features="*"/>
                        <table
                            jcr:primaryType="nt:unstructured"
                            features="*"/>
                        <misctools
                            jcr:primaryType="nt:unstructured"
                            features="*"/>
                    </rtePlugins>
                    <uiSettings jcr:primaryType="nt:unstructured">
                        <cui jcr:primaryType="nt:unstructured">
                            <inline
                                jcr:primaryType="nt:unstructured"
                                toolbar="[#format,-,#justify,-,#lists,-,links#modifylink,links#unlink,links#anchor,-,subsuperscript#superscript,subsuperscript#subscript,-,#paraformat,#styles,-,edit#cut,edit#copy,edit#paste-plaintext,edit#paste-default,edit#paste-wordhtml,-,undo#undo,undo#redo,-,findreplace#find,findreplace#replace,-,spellcheck#checktext,-,misctools#sourceedit,-,table#createoredit]">
                                <popovers jcr:primaryType="nt:unstructured">
                                    <format
                                        jcr:primaryType="nt:unstructured"
                                        items="[format#bold,format#italic,format#underline]"
                                        ref="format"/>
                                    <justify
                                        jcr:primaryType="nt:unstructured"
                                        items="[justify#justifyleft,justify#justifycenter,justify#justifyright]"
                                        ref="justify"/>
                                    <lists
                                        jcr:primaryType="nt:unstructured"
                                        items="[lists#unordered,lists#ordered,lists#outdent,lists#indent]"
                                        ref="lists"/>
                                    <paraformat
                                        jcr:primaryType="nt:unstructured"
                                        items="paraformat:getFormats:paraformat-pulldown"
                                        ref="paraformat"/>
                                    <styles
                                        jcr:primaryType="nt:unstructured"
                                        items="styles:getStyles:styles-pulldown"
                                        ref="styles"/>
                                </popovers>
                            </inline>
                            <tableEditOptions
                                jcr:primaryType="nt:unstructured"
                                toolbar="[table#insertcolumn-before,table#insertcolumn-after,table#removecolumn,-,table#insertrow-before,table#insertrow-after,table#removerow,-,   table#mergecells-right,table#mergecells-down,table#mergecells,table#splitcell-horizontal,table#splitcell-vertical,-,table#selectrow,   table#selectcolumn,-,table#ensureparagraph,-,table#modifytableandcell,table#removetable,-,undo#undo,undo#redo,-,table#exitTableEditing]"/>
                        </cui>
                    </uiSettings>
                </rte-in-dialog>

1 comment:
Subscribe to: Posts (Atom)