jQueryの検証：liveとajaxのvalが正しく動作しない

Question

私は、デバッグは別の作業であることを知っています。しかし、コードを正確に取得するために何十時間も費やしてしまった後、私はそれを修正する方法を全く知らない。

私はウェブフォームを検証するスクリプトを持っています。 Live demo here

ウェブフォームはほとんどのフィールドでオートコンプリートを使用します。検証では、オートコンプリートに使用される同じデータベースであるデータベース内の値のみが受け入れられます。 フィールドがエラーの場合は、赤色に変わります。 2つの依存フィールドもあります。 klasが正しく入力されていない場合は、leerlingにアクセスできません。

これまでのところとても良いです。しかし、いくつかの問題があります。彼らのほとんどはFFのIEにしか存在しません（私のマックでは不思議ではありません）。あなたのうちの何人かが私をここで助けてくれることを願っています。

1. フィールドが無効で、修正しようとすると、一度に1文字以上（すべてのブラウザ）を入力することはできません。これによりフォームの種類が使用できなくなります。

2. 日付フィールドが無効とマークされ、後で日付を選択すると、フィールドは無効とマークされます。

3. WindowsではIEとFFのように見えますが、on submitは検証されません。マックのサファリはしません。

あなたが私を助けることができたら本当にありがたいです。特別ポイントに1と3

がライブデモを参照してくださいLive demo here

スクリプトはこれです：

<script type="text/javascript"> 
$(document).ready(function() { 
    $("#newAp").validate({    
     validClass: 'succes', 
     ignore: '#opmerking', 
     errorContainer: '#newap-error', 
     highlight: function(element, errorClass) { 
      $(element).removeAttr("disabled"); 
      $("#" + $(element).attr("data-dependency")).attr("disabled", "disabled"); 
      $("#ll-naamErrorLabel").show(); 
      $(element).addClass(errorClass); 
     }, 
     unhighlight: function(element, errorClass) { 
      $(element).removeClass(errorClass); 
      $("#" + $(element).attr("data-dependency")).removeAttr("disabled"); 
      $("#ll-naamErrorLabel").hide(); 
      $("#ll-naam").focus(); 
     }, 
     rules: { 
      docent: { 
       required: true, 
       minlength: 4, 
       remote: "handlers/validationInSqlArray.php" 
      }, 
      'vak': { 
       required: true, 
       remote: "handlers/validationInSqlArray.php" 
      }, 
      'klas': { 
       required: true, 
       remote: "handlers/validationInSqlArray.php", 
      }, 
      'll-naam': { 
       required: true 
      }, 
      'datum': { 
       required: true 
      } 
     }, 
     messages: { 
      docent: { 
       required: "Vul uw achternaam in", 
       remote: "Alleen namen uit de suggestielijst zijn toegestaan", 
       minlength: jQuery.validator.format("Vul minimaal {0} tekens in."), 
      }, 
      vak: { 
       required: "U dient een vak in te vullen", 
       remote: "Alleen vakken uit de suggestielijst zijn toegestaan", 
      }, 
      klas: { 
       required: "Vul een klas in", 
       remote: "Alleen klassen uit de suggestielijst zijn toegestaan" 
      }, 
      'll-naam': "Voer de naam van de leerling in", 
      datum: "Selecteer een terugkomdatum" 
     } 

    }); 

    $('input, textarea').placeholder({ 
     blankSubmit:true 
    }); 


    $("#docent").autocomplete({ 
     source: "handlers/autocompleteDocent.php", 
     autoFill: true, 
     matchCase: true 
    }); 

    $("#vak").autocomplete({ 
     source: "handlers/autocompleteVak.php", 
     autoFill: true, 
     matchCase: true 
    }); 
    $("#klas").autocomplete({ 
     source: "handlers/autocompleteStamgroep.php", 
     autoFill: true, 
     matchCase: true 
    }); 
    $('#ll-naam').focus(function(){ 
     var url = 'handlers/autocompleteLeerling.php?stamgroep='+document.getElementById('klas').value; 
     $(this).autocomplete('destroy'); 
     $(this).autocomplete({ 
      source: url, 
      autoFill: true, 
      matchCase: true 
     }); 
    }) 

    $("#datum").datepicker({ 
     showWeek: true, 
     firstDay: 1, 
     showOtherMonths: true, 
     selectOtherMonths: true, 
     showOn: "both", 
     buttonImage: "style/images/icon_calendar.png", 
     buttonImageOnly: true, 
     monthNames: ['Januari','Februari','Maart','April','Mei','Juni','Juli','Augustus','September','Oktober','November','December'], 
     dayNamesMin: ['Zo', 'Ma', 'Di', 'Wo', 'Do', 'Vr', 'Za'], 
     dateFormat: 'dd-mm-yy', 
     beforeShowDay: noWeekendsOrBlockDay 
    }); 

    $('#newap-error').hide(); 
    $("#submit-succes").delay(6000).fadeOut(1000); 
}); 

</script> 

とフォーム：

<form method="post" action="" id="newAp" class="form"> 
     <div class="alert alert-error" id="newap-error"> 
      <p>Corrigeer de rood gemarkeerde velden</p> 
     </div> 
     <h2 class="form-title">Leerling aanmelden</h2> 
     <label for="docent">Docent</label> 
     <input type="text" name="docent" id="docent" placeholder="Vul uw achternaam in"/> 

     <label for="vak">Vak</label> 
     <input type="text" name="vak" id="vak" placeholder="Vul de naam van het vak in" /> 

     <label for="klas">Klas (stamgroep)</label> 
     <input type="text" name="klas" id="klas" placeholder="Klas van de leerling" value="" data-dependency="ll-naam" /> 

     <label for="ll-naam">Leerling</label> 
     <input type="text" name="ll-naam" id="ll-naam" placeholder="Naam van de leerling" disabled data-dependency="klas" /> 
     <label class="error" id="ll-naamErrorLabel">Vul eerst de klas in</label> 

     <label for="opmerking">Opmerking</label> 
     <textarea name="opmerking" name="opmerking" placeholder="Opmerking voor de surveillant."> </textarea> 
     <input type="hidden" name="opmerking_ph" value="Opmerking voor de surveillant." /> 

     <label for="date">Terugkom datum</label> 
     <input type="text" name="datum" id="datum" readonly='true' placeholder="Klik om datum te selecteren" /> 

     <input type="submit" class="submit" value="Opslaan" /> 

    </form> 

Answer 1

これは解決策ではありません。私が知る限り、またはどのように私がそれを見て、これらのすべてのエラーはjquery.validateが動作する方法に関連しています。

プラグインをすばやく見るだけでは、何がうまくいかないのかは分かりませんが、実際の実装とたとえば、http://www.codeproject.com/KB/ajax/jQueryValidateExample.aspxの例では大きな違いがあります。私はあなたがおそらくより多くの研究（このプラグインのドキュメントはかなりTBH限定されている）を実行することなく、私よりも簡単に答えることができ、その後、質問のカップルを持っている

：

1）をどのように/時に検証が実際に開始されますん？ （atmは、オートコンプリートの前に検証が行われているため、論理的に不要なエラーが返されます）。

2）強調表示/非表示のオプションは何をしますか？これらのオプションをサポートする検証プラグインのバージョンが見つからないので、私は不思議に思っていました。

私は、検証プラグインが多少時代遅れでバグがあると思われます。実装も問題になる可能性があります。私が間違っているなら私を訂正してください:)。答えが私にさらに得られるかどうかを見てみましょう。

いいえお返事