Question

我想提交一个驻留在jQuery UI选项卡中的表单 - 我希望操作页面在TAB中呈现...我能够在选项卡内“拦截”“a”标签以将这些链接调用到标签（感谢此处的帮助......）

使用此

$('#tabs-community').on('click', '.ui-tabs-panel a', function(){
    var $panel=$(this).closest('.ui-tabs-panel');
    $panel.load(this.href);
    return false;
});

我认为提交事件有类似的东西......我试过了这个

$('#formID').on('submit', function(e){
    e.preventDefault();
    var formSrc = $(this).attr('action');
    var formMethod = $(this).attr('method');
    var formData = $(this).serialize();
    $.ajax({
      url: formSrc,
      type: formMethod,
      data: formData,
      success: function(data){
        //work with returned data from requested file
        alert(data);
      }
    });
  });

（取自form submitting in jquery tab - 但这不是我追求的目标）

并且它“适用于”应该做的事情 - 但它会进行AJAX调用，并在警报中返回操作页面...而不是我想要的。

更不用说似乎jQuery正在删除提交按钮变量...例如我检查是否存在一个或另一个提交按钮 - HTML规范说明是否单击了提交按钮 - IT将作为值，但我的firebug控制台显示ajax表单提交 - “POST”显示按钮变量的NO SIGN（这是一个副作用，如果我可以让表单提交'正常'进入选项卡，我认为它会消失）......有什么建议吗？

希望这是有道理的。

Answer 1

显而易见的想法是将结果放入<iframe>。您可以像这样提交表单：

var $form = $('form#foobar');
//replace form by iframe
$form.hide();
$form.parent().append('<iframe id="submit-target" name="submit-target"></iframe>');
//submit form to new iframe (set target to name attribute of iframe)
$form.attr('target', 'submit-target');
$form.submit();

在an answer to another question中详细解释了向iframe提交表单。

Answer 2

我在jqueryui标签上使用，需要为当前页面上提交的所有表单制作一个简单的代码。

以下是基于您的代码的工作代码：

        $('form').submit(function(e) {
            e.preventDefault();

            var currentTab = tabs.tabs('option', 'selected'),
                tabId = $("li.ui-tabs-active").attr("id"),
                formSrc = $(this).attr('action'),
                formMethod = $(this).attr('method'),
                formData = $(this).serialize();

            $('#tabs-'+tabId).html("Loading...");

            $.ajax({
                url: formSrc,
                type: formMethod,
                data: formData,
                success: function(data){
                    $('#tabs-'+tabId).html(data);
                }
            });
        });

我当前的jqueryui版本是1.10.2和jquery 1.9.1。

jQuery UI - 在选项卡中提交表单

2 个答案: