形成内部没有阿贾克斯$成功提交功能(Form not submitting inside $.aja

我通过使用jQuery + Ajax的验证重复的名称。 一切工作正常，除了曾经的一切返回true形式不提交

发生了什么

• 如果没有输入名称，警告框被显示出来，说明名称是必需的 - >这里没有问题
• 如果发现重复的名字，警告框被显示出来，说明名字已经存在，形式不提交 - 在这里>没问题
• 如果没有发现重复的名字，警告框被显示出来（证明else工作条件的组成部分），但形式不提交 。 我希望表单继续前进，在这个本身提交else部分

jQuery代码

$('#form1').submit(function(){

    var name = $('#shelf_name').val();

    if(name == '')
    {
        alert('Shelf name is required');
        $('#shelf_name').focus();
    }
    else
    {                   
        $.ajax({
            type:'post',
            url:'check-duplicate-shelf-name.php',
            data:{'name':name},
            context:this,
            success:function(data)
            {
                if(data == 'stop')
                {
                    alert('Shelf name already exists'); // working if duplicate name is found
                }
                else
                {   
                    alert('else working?'); // alert box is showing up if name is not duplicate                                         
                    this.submit(); // but after alert, this line not executing
                }
            }
        });
    }


    return false;

});

HTML表单标签

<form action="add-shelf-post.php" method="post" id="form1">

检查重复的货架期name.php页

<?php

include 'confignew.php';

$name = $_POST['name'];

// peforming database operations
.
.
.

// and then

if($db->num_rows($q) == 0)
{
    echo 'go';
}
else
{
    echo 'stop';
}

我失去了一些东西很明显。 希望这里有人能指出这一点。

在Firefox中使用Firebug检查后​​，我的确得到了一个错误。 它没有显示出来，当我使用Chrome测试。 下面是截图。

Answer 1:

我测试你的代码，并在Chrome，IE 8和Mozilla Firefox的作​​品。 检查是否在你的整个页面没有包含在它的name属性值的话提交的元素。 如果将其重命名。 例如像这样的输入标签： <input type="submit" name="submit" value="Submit Form"/>将导致在Mozilla萤火虫出现的错误。

此外下面你可以找到一个替代的解决方案。

下面的解决方案已经在Chrome，IE 8和Mozilla Firefox成功测试。

另一种解决方案

检索信息网址，并要张贴，并在成功回调执行后的数据。

下面的实现已经在Chrome，IE 8和Mozilla Firefox成功通过测试 。 在成功回调，要过帐的数据被检索并发布到URL，并将结果放到ID为结果的股利。 你可以修改它以满足您的需求。

$(document).ready(function() {
    $('#form1').submit(function(){
        var name = $('#shelf_name').val();
        if(name == '')
        {
            alert('Shelf name is required');
            $('#shelf_name').focus();
        }
        else
        {
            $.ajax({
                type:'post',
                url:'check-duplicate-shelf-name.php',
                data:{'name':name},
                context:this,
                success:function(data)
                {
                    if(data == 'stop')
                    {
                        alert('Shelf name already exists');
                    }
                    else
                    {   
                        alert('else working?'); 
                        //this.submit();
                        //$(this).submit();

                        // get the post url and the data to be posted
                        var $form = $(this);
                            shelfNameVal = $form.find( 'input[id="shelf_name"]' ).val(),
                            url = $form.attr( 'action' );

                            // Send the form data and put the results in the result div
                            $.post(url, { shelf_name: shelfNameVal },
                                function(data) {
                                    $( "#result" ).empty().append(data);
                                }
                            );
                    }
                }
            });
        }
    return false;
    });
});

我希望这有帮助。

Answer 2:

我会在运行时使用jQuery验证检查，而不是提交，但另一种方法是使一个休息风格的呼叫。 我认为这是没有必要发布一个完整的形式只是为了检查1场。

$('#form1').submit(function(){
    //Check not empty
    if(!$('#shelf_name').val()) {
       alert('Shelf name is required');
       $('#shelf_name').focus();
    } else {   
       //Valiate Rest style call             
       $.getJSON("check-duplicate-shelf-name.php/".concat($('#shelf_name').val()), function(data) {
           //If you only have 2 states I would return boolean to faster check ex: if(!data){
           if(data == 'stop') {
               // working if duplicate name is found
               alert('Shelf name already exists'); 
           } else {   
               alert('else working?'); // alert box is showing up if name is not duplicate                                         
               $('#form1').submit(); // but after alert, this line not executing
           }
       });
    }
    return false;
});​

当我在，你可以手动发布您的形式不使用$（本）.submit评论说（）; 我指的是：

$.ajax({
       url: "./myurl",
       cache: false,
       type: "POST",           
       data: $("#form1").serialize(),
       success:  function(){
               console.log("Submit successful");
   }
});

Answer 3:

执行远程表单验证？ 检出jquery.validate plugin和它的.remote()规则。

除此之外你的代码看起来不错。 这里有一个工作演示： http://jsfiddle.net/dKUSb/7/

Answer 4:

而不是this.submit（）写：

document.yourFormName.method = "POST";
document.yourFormName.action = "Relative_URL_to_Go_to";
document.yourFormName.submit();

或者如果你不知道表格名称交替u可以使用：

document.forms[0].method = "POST";
document.forms[0].action = "Relative_URL_to_Go_to";
document.forms[0].submit();

Answer 5:

您可以受益于callbacks在这种情况下。 只需将代码分开象下面这样：

与将返回一个对象的回调函数{status: 'true or false', message: 'Some text'}

function validity(callback){

    var name = $('#shelf_name').val();

    if(name == '')
    {
        return callback({status: false, message: 'Shelf name is required'});
    }
    else
    {                   
        $.ajax({
            type:'post',
            url:'check-duplicate-shelf-name.php',
            data:{'name':name},
            context:this,
            success:function(data)
            {
                if(data == 'stop')
                {
                     return callback({status: false, message: 'Shelf name already exists'});                    

                }
                else
                {   
                    return callback({status: true, message: 'else working?'});
                }
            }
        });
    }

     //just for safety :))
    return callback({status: false, message: 'something went wrong completely'});
});

这将返回从AJAX调用的结果。 它会等待AJAX完成并返回相应的分支结果if ...

..您现在可以使用它作为这样的：

$('#form1').submit(function(){
    validity(function(result){
       if (result.status) { //status is true
           return true;
       } 
       else
       {
           alert(result.message);
           $('#shelf_name').focus(); 
           return false;      
       }
    });
});

...或只是将它们结合起来，如：

$('#form1').submit(function(){

        // definition
        function validity(callback){

            var name = $('#shelf_name').val();

            if(name == '')
            {
                return callback({status: false, message: 'Shelf name is required'});
            }
            else
            {                   
                $.ajax({
                    type:'post',
                    url:'check-duplicate-shelf-name.php',
                    data:{'name':name},
                    context:this,
                    success:function(data)
                    {
                        if(data == 'stop')
                        {
                             return callback({status: false, message: 'Shelf name already exists'});                    

                        }
                        else
                        {   
                            return callback({status: true, message: 'else working?'});
                        }
                    }
                });
            }

             //just for safety :))
            return callback({status: false, message: 'something went wrong completely'});
        });

        //usage
        validity(function(result){
            if (result.status) { //status is true
                return true;
            } 
            else
            {
                alert(result.message);
                $('#shelf_name').focus(); 
                return false;      
               }
            });
        });

希望这可以帮助

Answer 6:

完全由于范围

当你有

alert('else working?'); // alert box is showing up if name is not duplicate                                         
this.submit(); // but after alert, this line not executing

这指的是AJAX对象，而不是形式。 这是因为它现在是另一个函数中。

林加入$form = $(this); Ajax调用之前声明，你可以在回调中使用的变量。

试试这个：

$('#form1').submit(function( e ){

    e.peventDefault();

    var name = $('#shelf_name').val();

    if(name == '')
    {
        alert('Shelf name is required');
        $('#shelf_name').focus();
    }
    else
    {  
        $form = $(this);         
        $.ajax({
            type:'post',
            url:'check-duplicate-shelf-name.php',
            data:{'name':name},
            context:this,
            success:function(data)
            {
                if(data == 'stop')
                {
                    alert('Shelf name already exists'); // working if duplicate name is found
                }
                else
                {   
                    alert('else working?'); // alert box is showing up if name is not duplicate                                         
                    $form.submit(); // but after alert, this line not executing
                }
            }
        });
    }


    return false;
});

更新：我可能已经完全走出来了昨天。 尝试添加e.preventDefault（）; 正上方的提交调用。 另外，在函数（）的定义添加电子变量。 检查上面的更新的代码。

这里是preventDefault（）方法的一些文档： http://api.jquery.com/event.preventDefault/

Answer 7:

不要尝试太多检查得到简单的按钮，并在该事件ADDD onclick事件把下面的代码

HTML代码

<input type="button" value="submit" onclick="formsubmit();">

JavaScript代码

    function formsubmit() {
     var name = $('#shelf_name').val();

     if (name == '') {
         alert('Shelf name is required');
         $('#shelf_name').focus();
     } else {
         $.ajax({
             type: 'post',
             url: 'check-duplicate-shelf-name.php',
             data: {
                 'name': name
             },
             context: this,
             success: function (data) {
                 if (data == 'stop') {
                     alert('Shelf name already exists'); // working if duplicate name is found
                 } else {
                     alert('else working?'); // alert box is showing up if name is not duplicate
                     $('#form1').submit()
                 }
             }
         });
     }
 }

Answer 8:

形态没有提交的原因是要返回false从submit事件处理程序，这会导致不发生默认操作（提交）。 即使你调用submit()方法，你仍然是内submit事件处理程序，它返回false 。

你可能要考虑要么改变它处理您的表单提交也重复检查，或连接重复检查AJAX后到服务器端逻辑blur文本框的事件，或提交按钮由@rajesh kakawat的建议（除了与jQuery而不是HTML属性）附接。 例：

$('#form1').submit(function(){

    var name = $('#shelf_name').val();

    if(name == '')
    {
        alert('Shelf name is required');
        $('#shelf_name').focus();
        return false;
    }
});

$('#shelf_name').on('blur', function () {
    var $this = $(this),
        name = $this.val();
    if(name == '')
    {
        alert('Shelf name is required');
        $this.focus();
        return false;
    }

        $.ajax({
            type:'post',
            url:'check-duplicate-shelf-name.php',
            data:{'name':name},
            success:function(data)
            {
                if(data == 'stop')
                {
                    alert('Shelf name already exists'); // working if duplicate name is found
                }
                else
                {   
                    alert('else working?'); // alert box is showing up if name is not duplicate                                         
                    $('#form1').submit(); // this should work now
                }
            }
        });
});

我不知道为什么this.submit(); 行先前的工作，因为我不知道有足够的了解你的应用程序，脚本版本，等等。你可能要考虑使用的jsfiddle张贴的例子。

Answer 9:

$('#form1').submit(function(){

    var name = $('#shelf_name').val();

    if(name == '')
    {
        alert('Shelf name is required');
        $('#shelf_name').focus();
    }
    else
    {                   
        var istrue = false;        
        $.ajax({
            type:'post',
            url:'check-duplicate-shelf-name.php',
            data:{'name':name},
            context:this,
            success:function(data)
            {
                if(data == 'stop')
                {
                    alert('Shelf name already exists');
                    istrue = false;
                }
                else
                {   
                    alert('else working?') // alert box is showing up                           
                    istrue = true;
                }
            }
        });
        return istrue;
    }
});

一些像这样的事情:)不能测试

Answer 10:

我们有同样的问题，并认为我们整理出来。

问题是，在.submit()动作不“线程”内工作$.ajax没有$.post 。 对于您要添加的async:false内部指令$.ajax块并提交表单时， $.ajax执行完毕。

未经测试，但这样的工作思路：

HTML：

<input type='submit' onClick='javascript:MyCheck(); return false;'>

javacript：

function Mycheck() {

   var result = "";
   $.ajax {
       async:false,
       url: you_url_here,
       timeout: 15000,
       success: function(data) {
            result="success";
       },
       error: function(request, status, err) {
            result="error";
       }
   };

   // Here, if success -> SUBMIT FORM or whatever
   // Only get here if "ASYNC" = FALSE!!!
   if (result == "success") {
       $("form").submit(); // this submits the form
       return;
   } else {
       alert('error');
       // the form will not be post
   }
}

Answer 11:

享受它的工作..

document.createElement('form').submit.call(document.formname);

文章来源: Form not submitting inside $.ajax success function