Проверка Abide Фонда и вкладки

Question

Соблюдать версию 5.5.2 не проверяет скрытые поля. Однако это также означает, что проверка не работает для полей в неактивных вкладках.

Пример кода может быть:

<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 is required and must be a 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 is required.</small>
          </div>
      </div>
    </div>
  <button type="submit">Submit</button>
</form>

<script>
    $(document).foundation();
</script>

Жить здесь: http://jsfiddle.net/1ukfgwqt/ (не нажимайте вторую вкладку, прежде чем нажать Отправить).

Есть ли способ, кроме понижения до 5.5.1 или ручного редактирования файлов JS Foundation, чтобы включить проверку для скрытых полей или исправить проверку для неактивных вкладок (пока проблема, о которой я сообщал, не будет устранена)?

Answer 1

У меня такая же проблема. Мое решение состояло в том, чтобы сделать обратный вызов на вкладках, и рефлокировались так:

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