2012-04-06 8 views
1

入力フィールドに属性が必要かどうかを確認したいと思います。これらのフィールドに空の値があり、必須の属性がある場合は、各フィールドの後にエラーdivを追加します。セレクタの使い方について少し不便を感じました。Jquery Selector

// initialize validator for a bunch of input fields 
var inputs = $("#Contact :input") 

// Check all required fields 
if (inputs.attr("required") && inputs.val() === "") { 
    var invalidFields = Select all fields that have the attribute required and an empty value, and assign them a class 
    alert("Required Fields not completed"); 
} 

解決済みみんなありがとう!

答えて

0

トライ何かがそれが基準を満たすすべての入力にクラスを追加する必要があり

$("#Contact :input").each(function(){ 
     if ($(this).attr("required") && $(this).val() === "") 
     { 
     $(this).addClass("req"); 

     } 
     }); 
0

あなたが行方不明に必要なものに選択された要素を絞り込むためにコールバックしてfilter機能を使用することができます。このような

var inputs = $("#Contact :input"); 

var missing = inputs.filter(function() { 
    return this.getAttribute("required") && this.value === ""; 
}); 
+0

おかげで、それは私が必要としていたものman..exactly – user1265533

0

これを試してみてください:http://jsfiddle.net/aramk/mK8YL/

HTML:

<input id="some" class="required" name="some" type="text" value="" /> 
<input id="submit_btn" type="submit" value="Go!" /> 

JS:

$(document).ready(function() { 

    $('#submit_btn').click(function() { 
     // initialize validator for a bunch of input fields 
     var valid = true; 
     var inputs = $("input.required").each(function() { 
      var input = $(this); 
      // Check all required fields 
      if (input.val() === '') { 
       input.addClass('invalid'); 
       valid = false; // Avoid a submit 
       alert("Required Fields not completed"); 
      } else if (input.hasClass('invalid')) { 
       input.removeClass('invalid'); 
      } 
     }); 
     if (valid) { 
      // This will submit 
      alert('submit successful'); 
     } else { 
      return false; 
     } 
    }); 

} 
); 
​ 

CSS:

.required { 
    background: yellow; 
    color: black; 
} 

.invalid { 
    background: red; 
    color: white; 
}​ 

は、提出用フォームにこれらの入力を追加してください。各要素をループ

+0

WOW..thanks作業guys..got。 – user1265533

2

はそれを行う必要があります

$("#Contact :input [required]").each(function(){ 
if($(this).val()===""){ 
//the input doesn't have a value, but is required 
//code here 
} 
}); 
+0

ありがとうございました。 – user1265533

関連する問題