2

当用户单击提交按钮时，我有一个表单需要做两件事。第一个是向我发送电子邮件，第二个是将用户发送到 PayPal。我已经对其进行了设置，因此它首先对另一个页面进行 Ajax 调用，然后该页面发送电子邮件。一旦该页面返回成功，它就会调用一个函数来触发表单的提交。

我在表单中放入了一个标准按钮，而不是一个提交按钮，甚至还有一个 onclick 来检测它何时被点击。一切正常，直到我尝试在 Ajax 调用之后提交表单，此时表单未提交。这是我的javascript：

$('#submit-btn').on('click', function() {

    var err = false;
    $('input, textarea', '#booking-form').each(function(index, element) {
        if($(this).is('[required]') && $(this).val() < 2) {
            alert('Please enter your ' + $(this).prop('placeholder').toLowerCase() + ' before continuing.');
            $(this).focus();
            err = true;
            return false;
        }
    });

    if(err) {
        return false;
    }

    if($('#date').val() == 0) {
        alert('You must choose a date before booking');
        return false;
    }

    ShowLoadingScreen();

    var data = {
        'name': $('#name').val(),
        'address': $('#address').val(),
        'tel': $('#tel').val(),
        'email': $('#email').val(),
        'course': $('#course').find('option:selected').text(),
        'location': $('#location').find('option:selected').text(),
        'date': $('#date').find('option:selected').text()
    };
    AjaxHandler('book-course.php', data, "POST", true);
    //AjaxHandler sends the data off to book-courses.php, which then returns a call to BookingSuccess(). 
    //This is working fine as evidenced by the console.log line showing in the console.

});


function BookingSuccess() {

    $('#booking-form').submit();
    console.log('Booking success called...');

}

AjaxHandler 是一个自定义函数，它调用页面，然后处理某些响应，包括调用函数。正在调用 BookingSuccess，因为在控制台中正在输出 Booking Success called...。然而，表格并没有被提交。

我在这里创建了一个问题的 jsFiddle。

我试过的

到目前为止，我已经尝试了以下方法：

  • 跳过 Ajax - 没有效果
  • 直接使用按钮提交表单，忽略 Ajax 的需要 - 表单工作正常。
  • 删除了除表单之外的所有 HTML - 无效
  • 尝试在点击事件顶部提交表单#submit-btn- 无效
  • $('#booking-form').submit()在- 无效果内放置一个 return true 函数
  • 使用较长版本的 jQuery 触发器$('#booking-form').trigger('submit')- 无效。
  • 在表单中放置一个console.log事件onsubmit=""以查看表单是否被触发 - 适用于小提琴，但不适用于网站。

我不知道为什么这个表格不会提交。没有什么可以阻止它。我们正在到达并超越那条线。我在 FireBug 中设置了一个中断并介入，我们可以很好地使用该功能。它只是不做它的工作。

我怎样才能让这个表格正确提交？

4

1 回答 1

1

经过进一步检查（以及聊天中的一些死胡同和红鲱鱼），页面看起来有两个具有相同 ID 的元素。改变一个或另一个，你就是金子。

于 2013-10-21T16:40:52.097 回答