javascript - Foundation's Abide validation and tabs -


abide version 5.5.2 not validate hidden fields. however, means validation not work fields in inactive tabs.

sample code be:

<form data-abide>     <ul class="tabs" data-tab>       <li class="tab-title active"><a href="#panel1">tab name</a></li>       <li class="tab-title"><a href="#panel2">tab email</a></li>     </ul>     <div class="tabs-content">       <div class="content active" id="panel1">           <div class="name-field">             <label>your name <small>required</small>               <input type="text" required pattern="[a-za-z]+">             </label>             <small class="error">name required , must string.</small>           </div>       </div>       <div class="content" id="panel2">           <div class="email-field">             <label>email <small>required</small>               <input type="email" required>             </label>             <small class="error">an email address required.</small>           </div>       </div>     </div>   <button type="submit">submit</button> </form>  <script>     $(document).foundation(); </script> 

live here: http://jsfiddle.net/1ukfgwqt/ (don't click second tab before clicking submit).

is there way, other downgrading 5.5.1 or manually editing foundation's js files, reenable validation hidden fields or fix validation inactive tabs (until issue reported fixed)?

i have same issue. solution have callback on tabs , reflows abide :

    $(document).foundation({         tab: {             callback: function (tab) {                 $(document).foundation('abide', 'reflow');             }         }     }); 

Comments

Popular posts from this blog

facebook - android ACTION_SEND to share with specific application only -

python - Creating a new virtualenv gives a permissions error -

javascript - cocos2d-js draw circle not instantly -