selectに基づくjQuery検証

bugfix> javascript > 投稿 2020-08-22 18:28

これが私のコードです

$('.f1 .btn-next').on('click', function() {
    var parent_fieldset = $(this).parents('fieldset');
    var next_step = true;
    // navigation steps / progress steps
    var current_active_step = $(this).parents('.f1').find('.f1-step.active');
    var progress_line = $(this).parents('.f1').find('.f1-progress-line');
    // fields validation
    parent_fieldset.find('input[type="text"], select').each(function() {
         if( $(this).val() == "" ) {
            $(this).addClass('input-error');
            next_step = false;
        }
        else {
            $(this).removeClass('input-error');
        }
    });
    // fields validation

それは私の中で使用している一種の検証ですマルチステップフォームここでは、入力テキストフィールドの検証は完全に機能していますが、Select/Checkbox/Radioの場合は機能していません。コードを修正してください。

私はすでにこのコードを試しましたが、選択フィールドでは機能していません-

parent_fieldset.find('input[type="text"], select', '.sys').each(function() {

javascript

jquery

validation

回答 3 件

あなたは、タイプがテキストである入力だけが欲しいと言っているので、それはあなたが得ているものです。すべてのタイプの入力が必要な場合は、次のようにセレクタからタイプ指定を取り除いてください。
```
parent_fieldset.find(':input').each(function() {
}
```
編集：jQuery :input 拡張にはselect要素が含まれますが、 input しない。 jQueryのドキュメントはこちらです。

次のコードを試してください。

 parent_fieldset.find(':input').each(function() {
      //Your code goes here.
     }
//Try this one another way to validate form fields
     var allFormData = $('#myForm').serializeArray();
       for(var dataIndex = 0 ; dataIndex < allFormData.length ; dataIndex++){
         if(allFormData[dataIndex].value == ""){
          $("#myForm input[name="+allFormData[dataIndex].name+"]").addClass("input-error");
         }else{
            $("#myForm input[name="+allFormData[dataIndex].name+"]").removeClass('input-error');
         }
       }

これが、すべての選択、ラジオ、チェックボックスフィールドで完璧に機能する私の最終コードです
```
parent_fieldset.find('input[type="text"], select', '.sys').each(function(key, value) {
```

bugfix

入力タイプ= radio/checkbox/selectに基づくjQuery検証

javascript

jquery

validation

関連記事