0
我正在嘗試將JqGrid與WebAPI結合使用。要訪問我們需要設置自定義headers.For例如的WebAPI:向JqGrid添加自定義標題創建/編輯/刪除方法
headers: {
'Username': 'Administrator'
},
我能做到這一點通過AJAX加載網格。不過,我想利用JqGrid支持的創建/編輯/刪除。問題是,jqGrid的似乎並沒有讓我頭添加到呼叫:
$("#btnCreate").click(function() {
jQuery("#myGrid").jqGrid('editGridRow', "new", { reloadAfterSubmit: true, url: 'htp://localhost/colorfolder/insert' });
});
你如何添加標題來創建?
我不能添加標題到網格的負載,我甚至嘗試擴展onclickSubmit但無濟於事。
下面是代碼:
<head>
<title>htp://stackoverflow.com/questions/6831306/load-local-json-data-in-jqgrid-without-addjsonrows</title>
<meta htp-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="htp://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/themes/redmond/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="htp://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-4.1.2/css/ui.jqgrid.css" />
<script src="js/jquery-1.7.2.min.js" type="text/javascript"></script>
<script src="js/i18n/grid.locale-en.js" type="text/javascript"></script>
<script src="js/jquery.jqGrid.js" type="text/javascript"></script>
<script type="text/javascript">
$.jgrid.no_legacy_api = true;
$.jgrid.useJSON = true;
</script>
<script type="text/javascript">
function CallWebAPI() {
jQuery.support.cors = true;
var webAPIurl = "htp://localhost/colorfolder/list";
$.ajax({
url: webAPIurl,
headers: {
'Username': 'Administrator'
},
contentType: "application/json; charset=utf-8",
type: 'GET',
dataType: 'json',
data: "{}",
success: function (data) {
GetDataFields(data);
},
error: function (x, y, z) {
alert(x + '\n' + y + '\n' + z);
}
});
}
</script>
<script type="text/javascript">
var lastsel2
function GetDataFields(data) {
'use strict';
var data = {
"page": "1",
"records": "3",
"rows": data
},
grid = $("#myGrid");
grid.jqGrid({
colModel: [
{ name: 'FolderID', index: 'FolderID', width: "200" },
{ name: 'FolderDescription', index: 'FolderDescription', width: "105"}
],
onSelectRow: function (id) {
if (id && id !== lastsel2) {
jQuery('#myGrid').jqGrid('restoreRow', lastsel2);
jQuery('#myGrid').jqGrid('editRow', id, true);
lastsel2 = id;
}
},
pager: '#myGridPageControls',
datatype: "jsonstring",
datastr: data,
jsonReader: { repeatitems: false },
rowNum: 25,
viewrecords: true,
multiselect: false,
caption: "Folder",
height: "auto",
ignoreCase: true
});
$("#btnCreate").click(function() {
jQuery("#myGrid").jqGrid('editGridRow', "new", { reloadAfterSubmit: true, url: 'htp://localhost/colorfolder/insert' });
});
}
var grid = $("#myGrid"); // your jqGrid (the <table> element)
var orgEditGridRow = grid.jqGrid.editGridRow; // save original function
var folder = { "Params": "<Filters><FolderTypeID>1</FolderTypeID><FolderDescription>Test</FolderDescription></Filters>" };
jQuery.support.cors = true;
$.jgrid.extend({
editGridRow: function (rowid, p) {
$.extend(p, { // modify some parameters of editGridRow
onclickSubmit: function (formid) {
$.ajaxSetup({
headers: {
'Username': 'Administrator'
},
type: 'POST',
data: JSON.stringify(folder),
contentType: "application/json;charset=utf-8",
success: function (data) {
alert("inserting");
},
error: function (x, y, z) {
alert(x + '\n' + y + '\n' + z);
var alerting = "alert";
}
});
}
});
orgEditGridRow.call(this, rowid, p);
}
});
CallWebAPI();
</script>
</head>
<body>
<table id="myGrid"><tr><td/></tr></table>
<div id="myGridPageControls"></div>
<input type="button" id="btnCreate" value="Create" />
</body>
這是發送數據我相信。我正在嘗試向HTTP請求添加自定義標頭,以便對服務進行驗證。 – user1967363
例如,我在CallWebAPI函數中添加了一個頭文件:頭文件:{ '用戶名':'管理員' }我正在嘗試對JQgrid的原生編輯/創建/刪除調用執行相同的操作 – user1967363
也許我不會不明白你想做什麼。你不想傳遞額外的數據到你的控制器?正如你想在你的客戶端發佈的POST中包含額外的數據一樣? – Mark