使用ja/jQuery提交表单，并停留在同一页面

Submit a form with ja/jQuery and stay at same page

本文关键字：停留在 一页 表单 ja jQuery 提交 使用      更新时间：2023-09-26

标题就是我需要的。我发现我的问题有一些问题，但没有帮助。

这是我的代码

var confirmSave = confirm('Save;');
if(confirmSave){
    $('.redirected_form').submit( function() {
        $.ajax({
            url: $(this).attr('action'),
            type: $(this).attr('method'),
            data: $(this).serialize(),
            succes: function( data ) {
                        $('#myModal').modal('hide');                         
                    },
            error: function(){
                       alert('Something wrong');
                   }
        });
        return false;
    });

这段代码不会保存任何东西

与

var confirmSave = confirm('Αποθήκευση ραντεβού;');
if(confirmSave){
    document.getElementById("date_form_submit").click();
    $('.redirected_form').submit( function() {
        $.ajax({
            url: $(this).attr('action'),
            type: $(this).attr('method'),
            data: $(this).serialize(),
            success: function( data ) {
                         $('#myModal').modal('hide');                        
                     },
            error: function(){
                       alert('Something wrong');
                   }
        });
        return false;
    });

数据保存，但重定向到PHP页面…

任何想法?

谢谢

$("#button").click(function() {
   var form = document.getElementById("formid");
                    formdata2 = new FormData(form);
                    $.ajax({
                        url : "php file",
                        cache : false,
                        contentType : false,
                        processData : false,
                        data : formdata2,
                        type : "post",
                        success : function(data) {
                        }
                    });
                }
            });

您需要做的是，在确认后，触发表单提交。此外，将表单提交处理程序作为一个独立的块(而不是在confirm条件中)，如下所示。

var confirmSave = confirm('Αποθήκευση ραντεβού;');
if(confirmSave) {
    $('.redirected_form').submit();
}
$('.redirected_form').submit(function(e) {
    //e.preventDefault();
    $.ajax({
        url     : $(this).attr('action'),
        type    : $(this).attr('method'),
        data    : $(this).serialize(),
        success : function( data ) {
            $('#myModal').modal('hide');                         
        },
        error   : function(){
            alert('Something wrong');
        }
    });
    return false;
});

问题是您同时以两种方式发布数据。

两个解决方案:

  1. 你不需要使用表单的提交功能。只需在按钮上定义一个click处理程序(不是提交类型的)就足够了，该处理程序将使用序列化的数据执行AJAX调用，而不会重新加载页面。如果你想使用serialize()方法，我建议使用ID属性来选择你想要序列化的表单，并对其执行该方法。

  2. 您甚至可以调用事件对象的preventDefault()方法(您在代码中没有得到它，但它可以在您的提交事件处理程序中接收)，因此表单不会以传统方式发布，因此不会发生重载。

但是不推荐使用第二种方法。由于您使用的是AJAX，因此您应该在不提交表单的情况下完成此操作。

$('.redirected_form').on('submit', function(e) {
        e.preventDefault();
        $.ajax({
            url     : $(this).attr('action'),
            type    : $(this).attr('method'),
            data    : $(this).serialize(),
            success : function( data ) {
                        $('#myModal').modal('hide');                         
                      },
            error   : function(){
                         alert('Something wrong');
                      }
        });
});

嗯，你们的回答让我想起了你们所有人。谢谢你的帮助，问题解决了，代码

var confirmSave = confirm('Save;');
                    if(confirmSave)
                    {
                        document.getElementById("date_form_submit").click();
                    }

和不同的文字

jQuery(document).ready(function(){
    jQuery('.redirected_form').submit( function() {
        $.ajax({
            url     : $(this).attr('action'),
            type    : $(this).attr('method'),
            data    : $(this).serialize(),
            success : function( data ) {
                        $('#myModal').modal('hide');                         
                      },
            error   : function(){
                         alert('Something wrong');
                      }
        });
        return false;
    });
});

我是js jQuery新手，我无法解释为什么会这样。

谢谢大家的回答

相关文章：