JQuery Ajax Submit Function添加验证

时间:2014-03-01 10:39:24

标签: javascript jquery ajax

我正在使用此代码:

function submitForm() {
    $.ajax({type:'POST', 
          url: 'index.php', 
          data:$('#ContactForm').serialize(),
          success: function(response) {   
              $('#ContactForm').find('.form_result').html(response);
            }}
    );
    return false;
}

它运作良好,但如何添加验证,例如...如果用户名或密码为空则提醒?

我知道这些类似的脚本很多,但是特别希望将它添加到这个脚本中。

5 个答案:

答案 0 :(得分:2)

使用beforeSend()

  function submitForm() {
  $.ajax({type:'POST', 
      url: 'index.php', 
      data:$('#ContactForm').serialize(),
      success: function(response) {   
          $('#ContactForm').find('.form_result').html(response);
        }},
      beforeSend: function(){
        if(!$("#name").val()){
          alert("name field is empty.");
           return false;
          }    
      }
    );
return false;
}

答案 1 :(得分:1)

function submitForm() {
if(!$("#name").val()){
   alert("name field is empty.");
   return false;
}    


$.ajax({type:'POST', 
    url: 'index.php', 
    data:$('#ContactForm').serialize(), success: function(response) {
    $('#ContactForm').find('.form_result').html(response);
    }});

    return false;
}

答案 2 :(得分:0)

你必须在ajax调用语句之前执行验证

例如

function submitForm() {

var username=$('#id').value;
if(username!='')
{
    $.ajax({type:'POST', 

            url: 'index.php', 

            data:$('#ContactForm').serialize(), success: function(response) {

              $('#ContactForm').find('.form_result').html(response);

            }});
}
else
{
alert("Please Enter Username");
}

            return false;
    }

答案 3 :(得分:0)

您可能想要做这样的事情

function submitForm() {
    if (inputIsValid()) {
        sendAjaxRequest();
    } else {
        ShowMessage();
    }
}

function sendAjaxRequest(parameters) {

    $.ajax({
        type: 'POST',
        url: 'index.php',
        data: $('#ContactForm').serialize(),
        success: function (response) {
            $('#ContactForm').find('.form_result').html(response);
        }
    });
}

function inputIsValid() {
    return $("#username").val() && $("#password").val();
}

function ShowMessage() {
    alert("Please provide username and password");
}

答案 4 :(得分:0)

使用此链接参考http://jsfiddle.net/RH8Dy/以查看示例或以下给定的脚本

function submit()
{
var username = document.getElementById("txtusername").value;
var password = document.getElementById("txtpassword").value;
if(username == "")
{
alert("enter username");
}
if(username == "")
{
alert("enter username");
 }
else if(password == "")
{
    alert("Enter Password");
}
else
{
//ajax call
}
}