Freitag, 5. Mai 2017

Show Maximize Page after Submit

Do you want to show Maximize Page after Submit?

Let's start

1- Create your region and add a static ID. For example MAS

2- In the Template Options just choose "show Maximize Button"

3- Have a look at the Developper Tools to have the Correcte Selectors for Maximize/restore the Page

- When the Page is not maximize

<span class="js-maximizeButtonContainer"><button class="t-Button t-Button--noLabel t-Button--icon t-Button--iconOnly t-Button--noUI" aria-expanded="false" aria-controls="MAS" type="button" title="Maximize" aria-label="Maximize"><span class="t-Icon a-Icon icon-maximize" aria-hidden="true"></span></button></span>

- The Selector that we would use is the title attribute title="Maximize" as

#MAS [title='Maximize']


- When the Page is maximize

<span class="js-maximizeButtonContainer efc"><button class="t-Button t-Button--noLabel t-Button--icon t-Button--iconOnly t-Button--noUI" aria-expanded="true" aria-controls="MAS" type="button" title="RESTORE" aria-label="RESTORE"><span class="t-Icon a-Icon icon-restore" aria-hidden="true"></span></button></span>

- The Selector that we would use is the title attribute title="RESTORE" as

#MAS [title='RESTORE']


4- Create a Dynamic Action On Click for the Selector #MAS [title='RESTORE'] when it is clicked

 - Event: Click

 - Selection Type: Jquery Selector

 - Jquery Selector : #MAS [title='RESTORE']

 - Event Scope: Dynamic

 - Action: Execute Javascript:

localStorage.setItem("value", "1");

  - Fire on Initialization:No


5- Create a Dynamic Action On Click for the Selector #MAS [title='Maximize'] when it is clicked

 - Event: Click

 - Selection Type: Jquery Selector

 - Jquery Selector : #MAS [title='Maximize']

 - Event Scope: Dynamic

 - Action: Execute Javascript:

localStorage.setItem("value", "0");

  - Fire on Initialization:No

6- Create a DA on Page Load to show the Maximize Page after submit

 -Event: Page Load

 -Client-side Condition:
                   
                         -Type: Javascript Expression
                   
                         - Javascript Expression: localStorage.getItem("value")=='1'

-Event Scope: Static

-Action: Execute Javascript Code

javascript:apex.jQuery("#MAS .js-maximizeButtonContainer button").trigger("click");

7- Demo





















Keine Kommentare:

Kommentar veröffentlichen