使用 jQuery 选项卡 ajaxoptions 发布数据答案

【问题标题】：Posting data with jQuery tabs ajaxoptions使用 jQuery 选项卡 ajaxoptions 发布数据
【发布时间】：2010-12-13 20:06:05
【问题描述】：

我正在使用以下代码来初始化我的标签

 $('#tabs').tabs({
        fx: {
            opacity: 'toggle',
            duration: 'fast'
        },
        select: function () {
            $(this).tabs("option", {
                ajaxOptions: { data: vehicleJson }
             });
        },
        ajaxOptions: {
            type: 'post', 
            success: function(){
                alert('onSuccess');
            }, 
            error: function(){
                alert('onFail');
            }
        }, 
        spinner: ''
    }

在我的控制器中，我有：

[HttpPost]
public PartialViewResult Intervals(string vehicleJson)
{
    return PartialView("_Intervals");
}

如果我删除 [HttpPost] 属性，它似乎可以正常工作，除了它不是我需要的“帖子”。基本上我试图将一个 json 对象传递给一个帖子。我究竟做错了什么？这是我的标签的初始 HTML

<ul id="ul-tabs">
    <li><a href="/maintenance/Tabs/Intervals" title="Intervals">Intervals</a></li>
    <li><a href="/maintenance/Tabs/Lifetime" title="Lifetime Services">Lifetime Services</a></li>
    <li><a href="/maintenance/Tabs/Locator" title="Locator">Locator</a></li>
    <li><a href="/maintenance/Tabs/Procedures" title="Procedures">Procedures</a></li>
    <li><a href="/maintenance/Tabs/Specifications" title="Specifications">Specifications</a></li>
    <li><a href="/maintenance/Tabs/Reset" title="Reset">Reset</a></li>
</ul>

如何正确强制链接发布而不是获取？我想在服务器端使用 javascript 数据。

感谢您的提示或建议，
干杯，
~ck 在圣地亚哥

【问题讨论】：

当然，您的标签操作方法应该是“获取”，因为它提供标记，而不是帖子。帖子应始终重定向而不是用 html 响应。您使用 vehicleJson 字符串过滤联系人的事实？不让它成为一个帖子。
您的字符串类型也可能有问题。 vehicleJson 是字符串还是 json 对象。如果是后者，则需要对其进行字符串化

标签： javascript jquery asp.net-mvc jquery-ui

【解决方案1】：

您正在覆盖标签选择上的ajaxOptions。

这一行：

$(this).tabs("option", { ajaxOptions: {data: vehicleJson}});

将覆盖您之前设置的选项并导致选项卡使用 jQuery ajax 默认值 (type="GET")。

你可以这样修复它：

var tabAjaxOpts = { 
    type:'post', 
    success:function(){alert('onSuccess');}, 
    error:function(){alert('onFail');}
};

$('#tabs').tabs({
    fx: {
        opacity: 'toggle',
        duration: 'fast'
    },
    select: function () {
        tabAjaxOpts.data = vehicleJson;
        $(this).tabs("option", { ajaxOptions: tabAjaxOpts});
    },
    ajaxOptions: tabAjaxOpts
};

【讨论】：