代码之家 › 专栏 › 技术社区 › KallDrexx

我应该如何处理javascript调用中的Asp.net MVC url?

ajax asp.net-mvc javascript

KallDrexx · 技术社区 · 15 年前

我正在尝试编写我的Asp.net MVC Web应用程序的一个javascript重部分(网站的这一部分是使用Extjs的RIA)。然而,我在javascript中处理url的正确方法上遇到了停顿。

例如,现在我有一个Ajax调用 List 中的操作 ObjectsController ,它位于 Reading 区域。List操作接受一个参数 documentId (内景)。从现在起,这个映射到 /Reading/Objects/List 因为我还没有改变路线(网站目前还太年轻,无法确定路线)。通常在一个视图中,要将这个URL放在一个字符串中,我会 @Html.Action("List", "Objects", new { area = "Reading", documentId = 3) .

但是,这在处理javascript时不起作用,因为javascript不是由viewengine解析的。

为了解决这个问题,我有一个非常小的视图,它返回javascript常量,比如url,在主应用程序的js文件之前加载。问题是我不能打电话 Html.Action 因为在恒定的创建时间,我(显然)不知道ajax调用将是什么documentId,如果排除 文档ID 从 Html.操作 调用发生异常。文档ID可能在应用程序的正常工作流程中更改。

我该怎么处理?我不想硬编码URL到 /阅读/对象/列表 因为如果我为此更改了路由(对于用户更友好的jsonapi),或者此web应用程序不位于域的根目录下,则URL将不再有效。

其他人如何在javascript调用中处理MVC url?

3 回复 | 直到 15 年前

Johnny Oshika 15 年前

这是我一直在使用的安全技术。即使路由更改,JavaScript也将自动符合新路由:

<script>
var url = '@Url.Action("List", "Objects", new { area = "Reading", documentId = "_documentId_")';
var id = 100;
var finalUrl = url.replace('_documentId_', id);
</script>

" _documentId_ “本质上是一个虚拟占位符。然后在我的JavaScript中,我替换“ _文档ID_ “一旦我知道它是什么,就用正确的id值。这样,不管您的路由是如何配置的,您的URL都将保持一致。

更新日期:12月20日

我刚看到这篇有趣的博文。作者构建了一个库,允许您在VisualStudio中使用intellisense支持在JavaScript文件中构建路由。

http://weblogs.asp.net/zowens/archive/2010/12/20/asp-net-mvc-javascript-routing.aspx

Darin Dimitrov 15 年前

就我个人而言,我使用不显眼的JavaScript,避免使用JavaScript混合标记。AJAX调用通常通过单击一些按钮或链接来触发:

@Html.ActionLink("click me", "List", "Objects", 
    new { area = "Reading", documentId = 3 }, new { id = "foo" })

然后在单独的js文件中附加并处理onclick事件(例如jquery):

$(function() {
    $('#foo').click(function() {
        $('#resultDiv').load(this.href);
        return false;    
    });
});

尽可能地,我不需要在javascript文件中使用任何硬编码URL。URL应该始终由路由引擎处理,并由html帮助程序生成。

如果是 <form> 而不是一个链接,我会简单地处理 onsubmit 事件(同样的方式)并使用表单的 action 属性获取URL。

更新:

在注释部分指出只有在客户端才知道documentId之后,您可以执行以下操作:

@Html.ActionLink("click me", "List", "Objects", 
    new { area = "Reading" }, new { id = "foo" })

然后:

$(function() {
    $('#foo').click(function() {
        $('#resultDiv').load(this.href, { documentId: '123' });
        return false;    
    });
});

KallDrexx 15 年前

结果,这一切都是通过使用 Url.Action() 而不是 Html.Action() . Url.Action() 是(目前为止)允许我生成没有所有参数的url。我假设这只在路由没有在目标URL本身中指定参数时才起作用。