2014-09-26 97 views
-1

它不會提交即使字段不爲空FORM不會提交即使輸入字段不爲空

這裏的形式:

<form id="form" role="form" method='POST' action="user_add-post.php"> 
    <div class="form-group"> 
     <p><label class="control-label">Title</label><br /> 
      <input style="width: 40%" class="form-control" type="text" name="postTitle"/> 
    </div> 
    <div class="form-group"> 
     <p><label lass="control-label">Description</label><br /> 
      <textarea name="postDesc" cols="60" rows="10"></textarea> 
    </div> 
    <div class="form-group"> 
     <p><label>Content</label></p> 
      <textarea name="postCont" cols="60" rows="10"></textarea> 
    </div> 
    <input type='submit' name="submit" class='btn btn-primary' value='Submit'></form> 

,這裏是我的jQuery檢查輸入字段爲空:

$('#form').submit(function() { 
if ($.trim($("#postTitle").val()) === "" || $.trim($("#postDesc").val()) === "" || $.trim($("#postCont").val()) === "") { 
    alert('All fields required'); 
    return false; 
} }); 

現在爲什麼不提交?它一直說所有領域都是必需的,即使我已經填寫了領域。

+0

檢查JS控制檯中的JS錯誤。 – 2014-09-26 07:19:34

+0

請爲所有輸入提供ID – Khushboo 2014-09-26 07:20:45

+0

您正在使用帶有ID的jQuery選擇器,但您的元素沒有ID:P請參閱http://jsfiddle.net/gftntvrL/ – Alexandros 2014-09-26 07:22:51

回答

2

你已經錯過了在輸入框中添加ID,

<input style="width: 40%" class="form-control" type="text" name="postTitle"/> 

將其更改爲

<input style="width: 40%" class="form-control" type="text" id="postTitle" name="postTitle"/> 

爲一個文本框藏漢,請Refer

0

如果條件應該是這樣的:

if ($("#postTitle").val().trim() == "" || $("#postDesc").val().trim() == "" || $("#postCont").val().trim() == "") { 
0

如果你有任何JS錯誤,請參閱。另外,在各種瀏覽器上試用它。您不使用ID屬性,而是使用名稱屬性,因此它可能無法在Firefox和Chrome上運行,並且可能在IE7及更低版本上運行。希望這可以幫助你

0

在html代碼中爲輸入元素提供Id。

jQuery代碼是罰款

這裏是HTML

<input style="width: 40%" class="form-control" type="text" name="postTitle" id="postTitle"/> 
1

你還沒有給IDS任何表單域的正確的代碼,用全局選擇與條件 這裏是working fiddle of your task

`$("input[name=postTitle]").val()` //name selector instead of id 
1

您沒有定義ID,請將條件更改爲

if ($.trim($('[name="postTitle"]').val()) === "" || $.trim($('[name="postDesc"]').val()) === "" || $.trim($('[name="postCont"]').val()) === "") 
0

是的,像其他人都說如果你要使用選擇器,那麼你需要這些身份證上的表單字段。或者你可以使用的名稱是這樣的:

$("[name=postTitle]").val() 
$("[name=postDesc]").val() 
$("[name=postCont]").val() 

這是您的jQuery上述:

$('#form').submit(function() { 
if ($("[name=postTitle]").val().trim() == "" || $("[name=postDesc]").val().trim() == "" || $("[name=postCont]").val().trim() == "") { 
    alert('All fields required'); 
    return false; 
} }); 
0

正如其他人所說,該選擇是基於ID,但使用屬性值。所以你可以添加ID屬性,更改選擇器或使用不同的策略。

由於收聽者是在窗體上,所以這個內的函數引用窗體和所有具​​有名稱的窗體控件都可用作窗體的命名屬性。所以,你可以輕鬆地測試值包含使用正則表達式,除空白的東西,所以考慮:

var form = this; 
var re = /^\s*$/; 

if (re.test(form.postTitle.value) || re.test(form.postDesc.value) || re.test(form.postCont.value) { 

    /* form is not valid */ 

} 

這是很多比OP更有效。

鑑於與名以上,表單控件提交會掩蓋表單提交方法,這樣你就不能調用form.submit()$('#formID').submit()

相關問題