ASP.NET MVC中EasyUI的datagrid跨域調(diào)用實現(xiàn)代碼
更新時間:2012年03月14日 23:31:48 作者:
因為easyUI使用的是JQuery的異步方法加載數(shù)據(jù),應(yīng)該遵循JQuery的跨域訪問規(guī)則
最近項目中需要跨域調(diào)用其他項目的數(shù)據(jù),其他項目也是使用的EasyUI的datagrid組件,開始以為直接在datagrid的url屬性定義為其他項目的url地址即可,可是測試下發(fā)現(xiàn)的確是返回了json數(shù)據(jù)但是json數(shù)據(jù)提示“invalid label” 錯誤,網(wǎng)上搜索了下錯誤解決辦法,參考 “JavaScript處理Json的invalid label錯誤解決辦法“的方法利用datagrid的loadData方法加載并轉(zhuǎn)換了json還是提示上述錯誤,感覺原因不在格式問題。
搜索了下JavaScript跨域調(diào)用的文章“JavaScript跨域訪問問題解決方法”得到啟發(fā),發(fā)現(xiàn)原來是因為easyUI使用的是JQuery的異步方法加載數(shù)據(jù),應(yīng)該遵循JQuery的跨域訪問規(guī)則,也就是上述文章中提到的url中需要加入jsoncallback=?回調(diào)函數(shù)參數(shù),并且返回的json的格式必須修改為:回調(diào)函數(shù)名(json數(shù)據(jù)),而現(xiàn)在返回的數(shù)據(jù)只是json格式的數(shù)據(jù)沒有回調(diào)函數(shù)名,自然提示格式錯誤,于是修改了ASP.NET MVC自定義的JsonResult類,具體如何編寫自定義的JsonResult類見:自定義ASP.NET MVC JsonResult序列化結(jié)果,
代碼如下:
public class CustomJsonResult:JsonResult
{
public override void ExecuteResult(ControllerContext context)
{
if (context == null)
{
throw new ArgumentNullException("context");
}
HttpResponseBase response = context.HttpContext.Response;
if (!String.IsNullOrEmpty(ContentType))
{
response.ContentType = ContentType;
}
else
{
response.ContentType = "application/json";
}
if (ContentEncoding != null)
{
response.ContentEncoding = ContentEncoding;
}
if (Data != null)
{
#pragma warning disable 0618
//跨域調(diào)用需要修改json格式j(luò)soncallback
if (context.HttpContext.Request.Params.AllKeys.Contains("jsoncallback"))
{
String callback = context.HttpContext.Request.Params["jsoncallback"];
response.Write(callback+"("+JsonConvert.SerializeObject(Data)+")");
}
else
{
response.Write(JsonConvert.SerializeObject(Data));
}
#pragma warning restore 0618
}
}
}
EasyUI的datagrid的代碼如下:
//datagrid
$('#dg').datagrid({
url:'http://localhost:9000/ManagementSystem/ListCurrent?department=sss&jsoncallback=?',
pageNumber: 1,
pageSize: 20,
pageList: [20, 40, 60, 80, 100],
onDblClickRow: function(rowIndex) {
edit();
}
});
作者:mikel
出處:http://www.cnblogs.com/mikel/
搜索了下JavaScript跨域調(diào)用的文章“JavaScript跨域訪問問題解決方法”得到啟發(fā),發(fā)現(xiàn)原來是因為easyUI使用的是JQuery的異步方法加載數(shù)據(jù),應(yīng)該遵循JQuery的跨域訪問規(guī)則,也就是上述文章中提到的url中需要加入jsoncallback=?回調(diào)函數(shù)參數(shù),并且返回的json的格式必須修改為:回調(diào)函數(shù)名(json數(shù)據(jù)),而現(xiàn)在返回的數(shù)據(jù)只是json格式的數(shù)據(jù)沒有回調(diào)函數(shù)名,自然提示格式錯誤,于是修改了ASP.NET MVC自定義的JsonResult類,具體如何編寫自定義的JsonResult類見:自定義ASP.NET MVC JsonResult序列化結(jié)果,
代碼如下:
復(fù)制代碼 代碼如下:
public class CustomJsonResult:JsonResult
{
public override void ExecuteResult(ControllerContext context)
{
if (context == null)
{
throw new ArgumentNullException("context");
}
HttpResponseBase response = context.HttpContext.Response;
if (!String.IsNullOrEmpty(ContentType))
{
response.ContentType = ContentType;
}
else
{
response.ContentType = "application/json";
}
if (ContentEncoding != null)
{
response.ContentEncoding = ContentEncoding;
}
if (Data != null)
{
#pragma warning disable 0618
//跨域調(diào)用需要修改json格式j(luò)soncallback
if (context.HttpContext.Request.Params.AllKeys.Contains("jsoncallback"))
{
String callback = context.HttpContext.Request.Params["jsoncallback"];
response.Write(callback+"("+JsonConvert.SerializeObject(Data)+")");
}
else
{
response.Write(JsonConvert.SerializeObject(Data));
}
#pragma warning restore 0618
}
}
}
EasyUI的datagrid的代碼如下:
復(fù)制代碼 代碼如下:
//datagrid
$('#dg').datagrid({
url:'http://localhost:9000/ManagementSystem/ListCurrent?department=sss&jsoncallback=?',
pageNumber: 1,
pageSize: 20,
pageList: [20, 40, 60, 80, 100],
onDblClickRow: function(rowIndex) {
edit();
}
});
作者:mikel
出處:http://www.cnblogs.com/mikel/
您可能感興趣的文章:
- jQuery EasyUI API 中文文檔 - DataGrid數(shù)據(jù)表格
- Jquery下EasyUI組件中的DataGrid結(jié)果集清空方法
- jQuery easyui datagrid動態(tài)查詢數(shù)據(jù)實例講解
- jQuery EasyUI datagrid實現(xiàn)本地分頁的方法
- ASP.NET MVC使用EasyUI的datagrid多選提交保存教程
- jQuery EasyUI之DataGrid使用實例詳解
- jQuery EasyUI學(xué)習(xí)教程之datagrid點擊列表頭排序
- jquery easyui datagrid實現(xiàn)增加,修改,刪除方法總結(jié)
- jquery Easyui Datagrid實現(xiàn)批量操作(編輯,刪除,添加)
相關(guān)文章
jQuery動態(tài)追加頁面數(shù)據(jù)以及事件委托詳解
這篇文章主要為大家詳細(xì)介紹了jQuery動態(tài)追加頁面數(shù)據(jù)以及事件委托的相關(guān)資料,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-05-05jQuery Ajax前后端使用JSON進(jìn)行交互示例
本篇文章主要介紹了jQuery Ajax前后端使用JSON進(jìn)行交互示例,實現(xiàn)前端通過jQuery Ajax傳輸json到后端,后端接收json,對json進(jìn)行處理,后端返回一個json給前端,有興趣的可以了解一下。2017-03-03jQuery實現(xiàn)導(dǎo)航樣式布局操作示例【可自定義樣式布局】
這篇文章主要介紹了jQuery實現(xiàn)導(dǎo)航樣式布局操作,可實現(xiàn)基于jQuery的用戶自定義樣式布局與屬性動態(tài)操作相關(guān)技巧,需要的朋友可以參考下2018-07-07jquery trigger偽造a標(biāo)簽的click事件取代window.open方法
這篇文章主要介紹了使用jquery trigger 觸發(fā)a標(biāo)簽的click事件取代window.open方法,需要的朋友可以參考下2014-06-06