asp.net mvc jquery ajax post,使用ASP.NET MVC在JS文件中为jQuery设置ajax url

小编典典

这种方式充分利用了MVC路由，因此您可以充分利用MVC框架。受斯图史密斯答案的启发。

在这里，我有一个ApplicationController针对此URL的动态javascript 操作：

/application/js

我在此处包括静态文件，因为我只想下载一个主Javascript文件。您可以根据需要选择只返回动态内容：

///

/// Renders out javascript

///

///

[OutputCache(CacheProfile = "Script")]

[ActionName("js")]

public ContentResult RenderJavascript()

{

StringBuilder js = new StringBuilder();

// load all my static javascript files

js.AppendLine(IO.File.ReadAllText(Request.MapPath("~/Scripts/rr/cart.js")));

js.AppendLine(";");

// dynamic javascript for lookup tables

js.AppendLine(GetLookupTables());

js.AppendLine(";");

return new ContentResult()

{

Content = js.ToString(),

ContentType = "application/x-javascript"

};

}

这是创建查找表的帮助函数。只需为要使用的每个RouteUrl添加一行。

[NonAction]

private string GetLookupTables()

{

StringBuilder js = new StringBuilder();

// list of keys that correspond to route URLS

var urls = new[] {

new { key = "updateCart", url = Url.RouteUrl("cart-route", new { action = "updatecart" }) },

new { key = "removeItem", url = Url.RouteUrl("cart-route", new { action = "removeitem" }) }

};

// lookup table function

js.AppendLine("// URL Lookuptable");

js.AppendLine("$.url=function(url) {");

js.AppendLine("var lookupTable = " + new JavaScriptSerializer().Serialize(urls.ToDictionary(x=>x.key, x=>x.url)) + ";");

js.AppendLine("return lookupTable[url];");

js.AppendLine("}");

return js.ToString();

}

这将生成以下动态javascript，基本上只是从任意键到我的action方法所需的URL的查找表：

// URL Lookuptable

$.url=function(url) {

var lookupTable = {"updateCart":"/rrmvc/store/cart/updatecart","removeItem":"/rrmvc/store/cart/removeitem"};

return lookupTable[url];

}

在cart.js中，我可以具有这样的功能。请注意，url参数来自查找表：

var RRStore = {};

RRStore.updateCart = function(sku, qty) {

$.ajax({

type: "POST",

url: $.url("updateCart"),

data: "sku=" + sku + "&qty=" + qty,

dataType: "json"

// beforeSend: function (){},

// success: function (){},

// error: function (){},

// complete: function (){},

});

return false;

};

我可以从任何地方调用它：

RRStore.updateCart(1001, 5);

这似乎是我想出的唯一方法，它将使我能够以干净的方式使用路由。在javascript中动态创建URLS非常困难且难以测试。测试类型可以在此处的某处添加一层，以方便进行测试。

2020-07-26