2010-11-14 50 views
0

我有一個形式,在提交應該看到,如果文本區域沒有文字或佔位符文本。停止對錶格所需提交

IIF它它不應該提交。像驗證一樣。我無法停止表單提交。

$(document).ready(function() { 
    var options = { 
     target: '.user-status', 
     // target element(s) to be updated with server response 
     beforeSubmit: showRequest, 
     // pre-submit callback 
     success: showResponse, 
     // post-submit callback 
     // other available options: 
     //url:  url   // override for form's 'action' attribute 
     //type:  type  // 'get' or 'post', override for form's 'method' attribute 
     //dataType: null  // 'xml', 'script', or 'json' (expected server response type) 
     //clearForm: true  // clear all form fields after successful submit 
     resetForm: true // reset the form after successful submit 
     // $.ajax options can be used here too, for example: 
     //timeout: 3000 
    }; 

    $('#updateStatus').submit(function() { 
     $(this).ajaxSubmit(options); 
     return false; // prevent a new request 
    }); 

    function showRequest(formData, jqForm, options) { 

     var textbox = $('#StatusMessageMessage').val(); 
     if ((textbox == '') || (textbox == "What have you been eating ?")) { 
      alert(text); 
      return false; 
     } else { 
      $('#StatusMessageMessage').attr('disabled', true); 
     } 

    } 

    function showResponse(responseText, statusText, xhr, $form) { 
     $('#StatusMessageMessage').attr('disabled', false); 
    } 

    statusMEssagebox(); 


}); 



function statusMEssagebox() { 
    var textholder = $('#StatusMessageMessage').val(); 

    $('#StatusMessageMessage').focus(function() { 
     if ($(this).val() == textholder) $(this).val(""); 

     $(this).animate({ 
      "height": "48px", 
     }, "fast"); 
     $('.share').slideDown("fast"); 
     $(this).TextAreaExpander(48, 75); 

    }); 

    $('#StatusMessageMessage').blur(function() { 
     if ($(this).val() == "") { 
      $(this).val(textholder); 
      $('.share').slideUp("fast"); 
      $(this).animate({ 
       "height": "18px", 
      }, "fast"); 
     } 
    }); 
} 

回答

1

我看到你使用jQuery形式插件ajaxify表單。文檔中有一個example,說明如何以優雅的方式實現這一點。您無需訂閱表格的.submit事件,並使用.ajaxSubmmit手動提交。你可以簡單地嘗試這個辦法:

$(function() { 
    $('#updateStatus').ajaxForm({ 
     beforeSubmit: function(formData, jqForm, options) { 
      var value = $('#StatusMessageMessage').val(); 
      if (value == '' || value == 'What have you been eating ?') { 
       return false; 
      } 
     } 
    }); 
}); 
+0

謝謝。所以我應該把它放在提交不點擊?將嘗試 – 2010-11-14 09:45:18

+0

不,不在提交,也不在點擊。在我的例子中應該在$(document).ready'中。你只是聲明'updateStatus'將是一個ajax表單,這意味着當表單被提交時它將發送一個ajax請求,而不是一個普通的請求。我們還訂閱了'beforeSubmit'事件,它允許我們在發生驗證錯誤時取消提交。 – 2010-11-14 09:46:23

+0

它在裏面準備好文檔。我編輯了代碼。現在當驗證失敗時,它發送一個正常的請求,而不是ajax。 :( – 2010-11-14 09:50:41

1

您正在使用等號運算符而不是比較。

此:

if ((textbox = '') || (textbox = "What have you been eating ?")) { 
Problem -----^ 

應該是:

if (textbox == '' || textbox == "What have you been eating ?") { 

你也可以看到如何使用通過Ajax提交表單的jQuery:

+0

我改變了這一切。仍然不會停止通過正常提交提交表單(嘗試在這裏的AJAX) – 2010-11-14 09:56:37