Javascript/jquery驗證必填字段

我搜索了很多，但找不到我的問題的答案。首先，我想有一個提交按鈕，如果所有必填字段未填寫，將會禁用該按鈕。我發現了一些例子，如果所有的字段都填滿了，但我有要求和不需要的所以，我需要找到是否所需的填充或不。我目前沒有如何使它發生的想法。爲了以防萬一，我在Scala中使用了play framework 2.1.x。Javascript/jquery驗證必填字段

乾杯， Ilgün

來源

2013-10-01 Ducaz035

我一直在努力使用您的解決方案，

這是我的輸入：

<input class="required" placeholder="Required Field" required="true" name="tracktitle" type="text">

但是，按鈕沒有轉到啓用狀態。

JS：

<script> 
$(function() { 
    var submitButton = $("#myForm input[type='submit']").attr("disabled", true); 
    $("#myForm input.required").change(function() { 
     var valid = true; 
     $.each($("#myForm input.required"), function (index, value) { 
      alert("comes here"); 
      if(!$(value).val()){ 
       valid = false; 
      } 
     }); 
     if(valid){ 
      $(submitButton).attr("disabled", false); 
      console.log("valid"); 
      alert("valid"); 
     } 
     else{ 
      $(submitButton).attr("disabled", true); 
     } 
    }); 
}); 

</script>

我的提交按鈕：

<input type="submit" class="btn btn-primary" value="Submit" id="form-submit" onclick="return myConfirm();" />

來源

2013-10-01 13:28:20 Ducaz035

下面是一個簡單的例子：

首先，你可以找出一類的要求必填字段：

<form id="myForm"> 
    *<input type="text" class="required" /></br> 
    *<input type="text" class="required" /></br> 
    <input type="text" /></br> 
    <input type="text" /></br> 
    <input type="submit"/> 
</form>

最初禁用提交按鈕：

var submitButton = $("#myForm input[type='submit']").attr("disabled", true);

然後使用jQuery來循環每次更改時都會輸入您的輸入，並檢查其中是否有值。如果他們都有一個值，然後啓用提交按鈕，如果不將其禁用：

$("#myForm input.required").change(function() { 
     var valid = true; 
     $.each($("#myForm input.required"), function (index, value) { 
      if(!$(value).val()){ 
       valid = false; 
      } 
     }); 
     if(valid){ 
      $(submitButton).attr("disabled", false); 
     } 
     else{ 
      $(submitButton).attr("disabled", true); 
     } 
    });

請參閱本jsFiddle與你正在使用jQuery描述一個簡單的例子。

來源

2013-10-01 12:54:56

這只是普通的HTML一些基本的東西/ JS顯示輸入驗證的一個可行的辦法：

HTML：

<html> 
     <form id="form"> 
     <input class="form-input" data-required="true" type="text" /> 
     <input class="form-input" data-required="true" type="text" /> 

     <input class="form-input" data-required="false" type="text" /> 
     <input class="form-input" data-required="false" type="text" /> 

     <input id="form-submit" type="submit" disabled /> 
     </form> 
    </html>

JS：

$(document).ready(function() { 
     // on input change: 
     $(".form-input").on('change', function() { 
     // hide the input (not neccessary) 
     $("#form-submit").hide(); 
     // enable it 
     $("#form-submit").removeProp("disabled"); 

     // check all inputs 
     $.each(".form-input", function() { 
      // read element values 
      var required = $(this).data("required"); 
      var empty = ($(this).val() == "" || $(this).val() == null) 
      // if element is required but empty: 
      if (required && empty) { 
      // disable submit button 
      $("#form-submit").prop("disabled", "disabled"); 
      } 
     }   

     // now the submit button is enabled if all required inputs are filled 
     // and it is disabled if at least one required input is empty 

     // after hiding it: make the button visible again (not neccessary) 
     $("#form-submit").show(); 
     } 
    });

來源

2013-10-01 12:59:40 naloxx

Javascript/jquery驗證必填字段

回答

相關問題