jQuery и jquery.validate Проверяют только элементы формы, когда div показывает их (показать / скрыть)

Question

подтвердить для моей формы, я включил фрагмент HTML и кодирование. Для моего Типа профиля я использую фрагмент кода «показать / скрыть» для отображения другого div, если в «Типе профиля» выбрано значение 2. Здесь мне нужно, чтобы jquery.validate проверял только элементы формы div id="pro2", если он показан, и если нет, то не выдает ошибку, потому что она не завершена.

Вопросы, как мне это сделать?

<script type="text/javascript">
$(document).ready(function() {
    function showDiv(element, pro2) {
        if (pro2.children("option:selected").val() == 2) element.show();
        else element.hide();
    }
    var myElement = $("div#pro2");
    var mypro2 = $("select#ptype");
    $("select").change(function() {
        showDiv(myElement, mypro2)
    });
    $("#ctry").change(function() {
      $(".state").hide();
      var stateSelect = $("#state_" + $(this).val());
      stateSelect.show();      
    });
    $("input[data-code]").each(function() {
      $(this).autocomplete("/js/zip/" + $(this).data("code") + ".php", {
      matchContains: true, matchFirst: true, mustMatch: false,
      selectFirst: false, cacheLength: 10, minChars: 1, autofill: false,
      scrollHeight: 150, width: 180, max: 20, scroll: true
      });
    });
    $("#form1").validate({
        errorLabelContainer: $("#form1 div.error")
    });     
   // $("#reg_form").validate();    
});
</script>

HTML код:

<div class="error"></div>    
<label>Profile Type:</label>
          <select name="add[type]" id="ptype" 
          title="Select Profile Type!" class="{validate:{required:true}}">
            <option value="">-- Select</option>
            <option value="2">(MF/FF/MM)</option>
            <option value="1">F or M</option>
          </select>


    <div id="pro1">        
            <label>First Name:</label> 
            <input type="text" name="add[name]" size="20" maxlength="15" id="fname" 
            title="Your First Name" class="{required:true,minlength:1}"/>
            <span class="rsmall">internal use not displayed</span><br />
    </div>
    <div id="pro2">
            <label>First Name:</label>
            <input type="text" name="cpl[name]" size="20" maxlength="15" id="fname" 
            title="Your First Name" class="{required:true,minlength:1}"/>
            <span class="rsmall">internal use not displayed</span><br />
    </div>

Answer 1

На самом деле это должно работать.jquery.validate игнорирует все скрытые поля по умолчанию (если вы хотите настроить это поведение, у него есть опция «игнорировать», которая по умолчанию имеет значение «: hidden»).

Есть две странные вещи в вашемкод, ваши поля ввода используют тот же идентификатор "fname", и вместо class="{required:true,minlength:1}" это должно быть class="required" minlength="1".По крайней мере, в плагине jquery.validate я использую .Может быть, вы используете другой плагин или более старую версию?