在 JQuery 中使用参数重定向操作答案

【问题标题】：Redirect action with parameters in JQuery在 JQuery 中使用参数重定向操作
【发布时间】：2013-12-20 21:54:14
【问题描述】：

在我的 ASP.Net 项目中，我尝试在选择行表并单击按钮后将页面重定向到其他操作。所以我有这个代码：

JQuery：

function editItem(tableId, url) {
    if ($("#" + tableId + " .selected").exists()) {

        var thisRowId = $("#" + tableId + " .selected").attr("id");

        window.location.replace(url, { operation: "edit", carId: thisRowId });
    }
};

//more code

查看（ManagementCar）：

@model myProject.Model.Car.Car[]

<table class="table" id="tableCars">
    <thead>
        @*some code to header*@
    </thead>
    <tbody>
        foreach (var item in Model)
        {
        <tr id="@(item.Id)" onclick="selectRow('tableCars', '@(item.Id)')">
            <td>
                @Html.DisplayFor(modelItem => item.Name)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.OwnerName)
            </td>
            <td>
                @(item.IsSold == true ? "Yes" : "No")
            </td>
        </tr>
        }
    </tbody>
</table>
<br />
<button id="btEdit" type="button" class="disable" onclick="editItem('tableCars','CarOperation')">Edit</button>

控制器：

[HttpGet]
public ActionResult CarOperation(string operation, int carId)
{
    //some code...

    return RedirectToAction("ManagementCar", "Backoffice");
}

但是在重定向后我有一个服务器错误，说carId 参数为空。我调试我的 jquery 并且该参数不为空。我也试过做

$.get(url, { operation: "edit", carId: thisRowId });

改为

window.location.replace(url, { operation: "edit", carId: thisRowId });

但它不会重定向。我该如何解决这个问题？

【问题讨论】：

标签： javascript jquery asp.net redirect

【解决方案1】：

通过给它一个像这样的新值来设置它。

window.location = window.location.replace(url, "shouldBeAstringNotAJsonObject");

【讨论】：

对不起，实际上我遇到了错误。它会将我重定向到一个未定义的页面，例如：https://localhost/myProject/Backoffice/undefined。我不明白为什么...？
javascript 替换函数需要 2 个字符串作为参数。您在第二个参数上传递了一个 json 对象。 w3schools.com/jsref/jsref_replace.asp
我的意思是，你不应该在你的替换函数上传递一个 json 对象。 window.location.replace(url, "shouldBeAstringNotAJsonObject");
我尝试了一个字符串，但我得到了这个错误：“参数字典包含一个空条目”（...）

【解决方案2】：

好的，我终于用新的 url 路由配置和以下代码解决了这个问题：

我的 RouteConfig：

routes.MapRoute(
    name: "ManipulatingCar",
    url: "{controller}/{action}/{operation}/{carId}"
);

我的 JQuery：

editItem = function (tableId, url) {
    if ($("#" + tableId + " .selected").exists()) {

        var thisRowId = $("#" + tableId + " .selected").attr("id");

        var fullUrl = url + "/edit/" + thisRowId;

        window.location = fullUrl;
    }
};

基本上，控制器动作参数必须与RouteConfig.cs中指定的配置相匹配

【讨论】：

【解决方案3】：

使用window.location 的问题在于，没有在请求中传递引荐来源网址，因为这种行为只是模仿了一个新请求，就好像您在地址栏中键入了 URL。如果您打算使用网站分析，可靠的推荐人将非常重要。我使用 jQuery 生成一个动态链接，在该链接上我调用 click()。

var url = '/my/url';
$('<a href="' + url + '"></a>')[0].click();

注意我 click() 底层元素不是 jQuery 选择的对象，原因是 jQuery 单击只会引发事件并且 href 未导航到，而索引元素并单击将导致与您相同的行为就像您实际点击了页面上的链接一样。

我整理了一个jQuery.navigate plugin，它巧妙地将其包装起来，并将您的站点地图从您的 UI 逻辑中抽象出来，您可能会觉得这很有用。例如，使用我的插件意味着您可以完全删除您的 editItem 函数，只需将您的标记更改为这样的内容？

<tr id="@(item.Id)" onclick="$.navigate('to', 'edit', { id : '@(item.Id)' })">

【讨论】：