在传递模型数据时通过JQuery POST更改视图

时间:2014-09-16 17:18:54

标签: jquery asp.net-mvc

我正在为我们的搜索索引开发内部测试网站,我希望在搜索查询页面上输入并提交所有数据后,将页面重定向到搜索结果页面。在收到此作业之前,我从未实施过网站(仅限基本HTML)。无论如何,我已经取得了很好的进展(有一些令人沮丧的障碍),但考虑到我现在使用的工具,这个似乎是不可能的,尽管不应该这样。

我有一个复杂对象数组(QueryDataModel),我传递给控制器​​,因为它告诉服务器在哪里以及使用什么参数运行哪些搜索。这些参数和服务器数据是通过Javascript从页面上的表单收集的。我发布该数据时没有任何问题$.ajax,但问题是如果我使用$.ajax,我无法立即将用户重定向到新页面。

然后我发现我可以使用非AJAX POST立即重定向用户,但似乎我不可能以这种方式传递复杂的参数; jQuery中没有任何支持良好的函数来执行非AJAX POST。流行的方式似乎是设置一个假表单,然后使用你想要传递的参数填充其输入,这似乎不适用于我拥有的对象。

现在我已将其设置为进行重定向操作,因为我在MSDN上阅读了RedirectToAction的描述并认为它实际上会强制浏览器更改页面...唉,它没有。

那么,我如何将一组复杂对象传递给控制器​​以用作新视图的模型,然后将用户重定向到该新视图?

控制器操作:

public ActionResult Results()
    {
        ViewData["MrSIXGTs"] = MvcApplication.MrSixGts;
        ViewData["MrSIXs"] = MvcApplication.MrSixs;
        return View(MixedSearch(TempData["qdm"] as QueryDataModel[]));
    }

    public ActionResult RedirectResults(QueryDataModel[] qd)
    {
        TempData["qdm"] = qd;
        return RedirectToAction("Results", "Search");
    }

相关的Javascript(我已经尝试过的注释方法):

var qdm = [];
    $('#search-list > .search-form').each(function() {
        var formwrapper = this;
        var servs = [];
        var c = 0;
        $('#' + $(formwrapper).attr('id') + ' > .server-checkbox:checked').each(function () {
            servs.push($(this).attr('name'));
            c++;
        });
        $('#' + $(formwrapper).attr('id') + ' > .form-wrapper > form').each(function() { // only one iteration; not really a loop
            var z = new QueryDataModel($(this).parent().attr('id'), servs, $(this).serializeArray(), {});
            qdm.push(z);
        });
    });
//$.doPost('/Search/RedirectResults', { qd: qdm }); // fake form function
    var str = $.param(qdm);
    alert(str);
    document.location = baseUrl + '/Search/RedirectResults' + '?' + str; // doesn't serialize properly due to the complexity
    /*
    $.ajax({ // doesn't redirect the user
            type: 'POST',
            contentType: 'application/json',
            url: '/Search/RedirectResults',
            data: $.toJSON(qdm),
            success: function () {
                //alert(baseUrl + '/Search/Results');
                //window.location.href = baseUrl + '/Search/Results';
            },
            error: function(e, t, n) {
                alert(t + ": " + n);
            }
    });*/
function QueryDataModel(sn, serv, fd, fc) {
    this.SearchName = sn;
    this.Servers = serv;
    this.InputParams = fc;
    this.FormData = $.toJSON(fd); // easier to deserialize this stuff server-side into InputParams
}

1 个答案:

答案 0 :(得分:0)

最简单的方法可能是发布一个简单的输入表单,其中JSON.stringify您的大对象作为值