The xpage ssjs code to open xe:dialog does not open dialog but change document mode from edit to read

Question

My Xpage has five sections for workflow. Section 1 submit button works fine. For second section submit button I'm calling xe:dialog box (using ssjs) to get some user inupt and it does open the xe:dialog box. But original document is now in read mode and submit button is not visible

If I remove the section 1, the section 2 button open dialog and does not change the document mode of original document.

Here is a sample code of xpage with dialog box and button.

<?xml version="1.0" encoding="UTF-8"?>
<xp:view
    xmlns:xp="http://www.ibm.com/xsp/core"
    xmlns:xe="http://www.ibm.com/xsp/coreex"
    dojoTheme="true"
    dojoParseOnLoad="true">
    <xp:this.resources>
        <xp:dojoModule
            name="dijit.Dialog"></xp:dojoModule>
        <xp:dojoModule
            name="dijit.form.Button"></xp:dojoModule>
        <xp:dojoModule
            name="dijit.form.TextBox"></xp:dojoModule>
    </xp:this.resources>
    <xp:br></xp:br>
    <xp:this.data>
        <xp:dominoDocument
            var="document1"
            formName="MetalWorking">
        </xp:dominoDocument>
    </xp:this.data>
    <xp:panel>
        <xp:panel>

            &#160;
            <xp:button
                value="Lab Man Approval"
                id="button4">
                <xp:this.rendered><![CDATA[#{javascript:document1.isEditable() & (document1.getItemValueDate("Section1DateCompleted")!=null) & (document1.getItemValueDate("Section2DateCompleted") == null)
}]]></xp:this.rendered>
                <xp:eventHandler
                    event="onclick"
                    submit="true"
                    refreshMode="complete"
                    immediate="false"
                    save="true">
                    <xp:this.action>
                        <xp:executeScript>
                            <xp:this.script><![CDATA[#{javascript:var d=getComponent('dialog2');
d.show();}]]></xp:this.script>
                        </xp:executeScript>
                    </xp:this.action>
                </xp:eventHandler>
            </xp:button>
            &#160; &#160;<xp:br></xp:br>
            <xe:dialog
                id="dialog2">
                <xp:panel
                    style="background-color:rgb(226,226,226)">
                    <xp:table>
                        <xp:tr>
                            <xp:td>
                                <xp:label
                                    value="Response"
                                    id="responseArea_Label1"
                                    for="responseArea1">
                                </xp:label>
                            </xp:td>
                            <xp:td>
                                <xp:inputText
                                    id="responseArea1">
                                </xp:inputText>
                            </xp:td>
                        </xp:tr>
                    </xp:table>
                </xp:panel>
            </xe:dialog>
        </xp:panel>
    </xp:panel>
    <xp:table>
        <xp:tr>
            <xp:td>
                <xp:label
                    value="Doc history:"
                    id="docHistory_Label1"
                    for="docHistory1">
                </xp:label>
            </xp:td>
            <xp:td>
                <xp:inputText
                    value="#{document1.DocHistory}"
                    id="docHistory1">
                </xp:inputText>
            </xp:td>
        </xp:tr>
    </xp:table>
</xp:view>

Answer 1

Are you sure thats because of the "document1.isEditable()" and not because of all the other parts in your if your statement?

if i change your rendering code just like that

<xp:this.rendered><![CDATA[#{javascript: document1.isEditable() }]]></xp:this.rendered>

the button is pretty much visible.