为什么不能在表单提交时处理我的ajax函数？

-1

这是我的问题。我正在尝试验证表单，并确保在允许表单提交之前提供用户名。我所有的功能都正常工作，包括我的PHP脚本检查用户名。不过，我无法停止表单提交时提交。我得到的是我定义的AJAX .error（消息）。 Firebug报告为什么不能在表单提交时处理我的ajax函数？

throw Components.Exception("prompt aborted by user", Cr.NS_ERROR_NOT_AVAILABLE);

但是，当我调用e.preventDefault（）;在username_exists函数之外，它会停止提交表单，并允许我在前面提到的函数中进行检查。我完全难过，希望你能帮上忙。谢谢。

PS。我甚至不能做一个简单的警报（）这个函数

$(function(){ 
    check_username_onsubmit(); 
}); 


function check_username_onsubmit(){ 
    $this = $('#username.registerForm'); 
    $('form.registerForm').submit(function(e){ 
     username_exists($this, function(data){ 
      if(data.found == 1){ 
       e.preventDefault(); 
       alert('Username Taken'); 
      }else{ 
       alert('Username Free'); 
      } 
     }); 
     // e.preventDefault(); 
    }); 
} 


function username_exists($this, callback){ 
    var username = $this.val(); 

    $.ajax({ 
     url : '../includes/Single Scripts/username_exist.php', 
     data : { 
      username : username 
     }, 
     type : 'POST', 
     dataType : 'json', 
     success : function(data){ 
      callback(data); 
     } 
    }).error(function(){ 
      alert('An error has occured'); 
    }); 
}

来源

2012-05-07 yehuda

您正在使'$ this'成为一个全局变量。也许它在其他地方得到更新？ –

@火箭除了里面的函数，我还没有在其他任何地方使用它。 – yehuda

为什么downvote？请解释！ – yehuda

里面check_username_onsubmit()，扔在一个return false;它将从停止提交表单。

如果您已经知道，那么开始检查以确保您正确地将JavaScript方法附加到您的提交事件或提交点击事件。该函数可能甚至没有被调用。

来源

2012-05-07 19:11:10 Kristian

这就是'e.preventDefault（）;'应该做的。 –

我知道如何停止form提交，但我甚至不能在我的内部函数中做一个简单的alert（）。 – yehuda

这是正确的附加，因为我解释说我可以阻止点击提交，只是Ajax功能不工作 – yehuda

我将删除<input type="submit">并在</form>之后添加<button id="send">。

然后，这样做：

$('#send').on('click', function() { 
    var uname = $('#username.registerForm').val(); 
    username_exists(uname, function (data) { 
     if (data.found == 1) { 
      alert('Username Taken'); 
     } else { 
      alert('Username Free'); 
      $('form.registerForm').submit(); 
     } 
    }); 
});

编辑：另外：

function username_exists(username, callback) { 
    $.ajax({ 
     url: '../includes/Single%20Scripts/username_exist.php', 
     data: { 
      'username': username 
     }, 
     type: 'POST', 
     dataType: 'json', 
     success: function (data) { 
      callback(data); 
     } 
    }).error(function() { 
     alert('An error has occured'); 
    }); 
}

来源

2012-05-07 19:16:25 honyovk

这不是一个坏的解决方案，但它是一个黑客攻击。我想回答为什么我的AJAX无法正常工作 – yehuda

@yehuda查看我的编辑 – honyovk

添加了哪些内容有帮助？ – yehuda

提交，由于其本身的设计，离开页面。 AJAX，通过其非常设计，不会离开页面。

如果您希望在将表单发送到服务器之前使用JavaScript来验证您的表单，请删除提交按钮。单击时关闭客户端验证脚本，如果通过，请执行AJAX调用。

$('#someForm').on('click','#myButton', {}, aValidationFunctionToCall); 

aValidationFunctionToCall : function (event) { 
    // validate stuff 
    // show the user the error of their ways 
    // or call your ajax 
}

来源

2012-05-07 19:34:30

欢呼声，现在看着它 – yehuda

为什么不能在表单提交时处理我的ajax函数？

回答

相关问题