CoCreate-conditional-logic

Simple JS component show   hide elements conditionally with inputs,checkbox,radio,btn etc.Great for creating tabs, accordions, dynamic forms, etc. Easy Configuration using HTML5 data attributes and/or JavaScript API

Install

npm i @cocreate/conditional-logic

Or you can use cdn link:

<script>https://cdn.cocreate.app/conditional-logic/latest/CoCreate-conditional-logic.min.js</script>

Usage

This is conditional-logic usage

                                
    <h5 style='color:blue'>Toggle</h5>
    <div hide='#testdiv,#div2'  show='.testdiv,.div2'>
           <div  class="test">click me</div><br/>
    </div>
    <div id='testdiv' class="hidden testdiv"> Only SHOW </div>
    <div id="div2" class="hidden div2"> Only SHOW2</div>
                                
                            

This is conditional-logic usage

Attributes

  • show string optional

    selector of elements to display

  • hide string optional

    selector of elements to hide

Demo