Page History

Click on "Toggle" button to show either block 1 or block 2 below

HTML

<form class="aui">
	<button type="button" class="aui-button" id="myToggler">Toggle</button>
</form>
<script type="text/javascript">
  AJS.toInit(function() {
     AJS.$('#myToggler').click(function(){
       AJS.$('#block1').toggle();
       AJS.$('#block2').toggle();
	 });
  });
</script>

Storage format

Code Block

<ac:structured-macro ac:macro-id="e9869280-f206-4c2f-b1bf-2f223876046e" ac:name="html" ac:schema-version="1">
  <ac:plain-text-body><![CDATA[<form class="aui">
	<button type="button" class="aui-button" id="myToggler">Toggle</button>
</form>
<script type="text/javascript">
  AJS.toInit(function() {
     AJS.$('#myToggler').click(function(){
       AJS.$('#block1').toggle();
       AJS.$('#block2').showtoggle();
	 });
  });
</script>

]]></ac:plain-text-body>
</ac:structured-macro>
<p>
  <br/>
</p>
<p>
  <br/>
</p>
<ac:structured-macro ac:macro-id="ba9ae099-2555-4d33-9845-00c3779aed7b" ac:name="div" ac:schema-version="1">
  <ac:parameter ac:name="id">block1</ac:parameter>
  <ac:rich-text-body>
    <h1>Block 1</h1>
  </ac:rich-text-body>
</ac:structured-macro>
<ac:structured-macro ac:macro-id="c4b75335-6807-4384-8667-65a9aad0fbb5" ac:name="div" ac:schema-version="1">
  <ac:parameter ac:name="style">display:none;</ac:parameter>
  <ac:parameter ac:name="id">block2</ac:parameter>
  <ac:rich-text-body>
    <h1>Block 2</h1>
  </ac:rich-text-body>
</ac:structured-macro>

Versions Compared

Old Version 3

New Version Current

Key