私はAsp.Net/C#自分のアプリケーションで使用しています。データを表示する必要があるという要件がありjqGridます。データはテーブルから取得する必要があります。Usersこれは初めてですが、誰かが最初jqGridから始めるのを手伝ってくれjqGridますWeb Formsか。例やリンクは感謝します。ありがとう。
質問する
12963 次
3 に答える
3
以下のリンクをたどってください。
http://blog.prabir.me/post/Using-jqGrid-with-ASPNET-Web-Forms-e28093-Part-I.aspx
http://forums.asp.net/t/1638413.aspx/1
http://wiki.asp.net/page.aspx/1774/jqgrid-and-aspnet-web-forms/
http://praveen1305.blogspot.co.uk/2009/05/jqgrid-with-asp-net-web-forms.html
それが役に立てば幸い
于 2012-04-27T08:38:07.687 に答える
1
グリッドの下部にあるページャーには、空のテーブル要素と空のdivだけをアプリケーションに含めることができます。
<table id="grid" ></table>
<div id="pager"></div>
次に、
<script type="text/javascript">
$(function () {
$("#grid").jqGrid({
url: 'someURLfromYourProject', // 'xxx.svc', 'xxx.asmx', 'xxx.ashx' ...
datatype: 'json',
pager: '#pager',
gridview: true,
height: 'auto',
//... other parameters
});
});
</script>
これにより、実行時にグリッド内の空のテーブルとdivが変更されます。グリッドのデータは、urlオプションで指定されたURLから取得されます。
WFC、ASMX Webサービス、またはASHXハンドラーを既存のアプリケーションに非常に簡単に統合できることを理解することが重要です。既存のプロジェクトに新しいページを追加するだけです（ASP.NETプロジェクトのソリューションエクスプローラーで[新しいアイテムの追加]コンテキストメニューを選択します）。この方法で、主にASP.NETアプリケーションで使用されるテクノロジからより独立したコードを作成します。後でアプリケーションをASP.NETMVCに移行することにした場合は、アプリケーションのWFCASMXWebサービスまたはASHXハンドラー部分を変更することもできません。
回答には、ダウンロードして少し再生できるデモプロジェクトのURLがいくつかあります。ほとんどのコードをASP.NETMVCの例（こことここを参照）からWCF / ASMX/ASHXコードに移動できます。
于 2012-04-27T09:07:01.620 に答える
0
JQGRIDの例：-
リンクhttp://www.trirand.com/blog/?page_id=6から必要なすべてのスクリプトファイルをダウンロードします
Design.aspxaspx ページの本文セクションでスクリプトを定義しました。
このグリッドを検索機能にのみ使用しているので、編集および削除機能を無効にしました
<script src="../JQGridReq/jquery-1.9.0.min.js"></script>
<script src="../JQGridReq/grid.locale-en.js"></script>
<link href="../JQGridReq/jquery-ui-1.9.2.custom.css" rel="stylesheet" />
<script src="../JQGridReq/jquery.jqGrid.js"></script>
<link href="../JQGridReq/ui.jqgrid.css" rel="stylesheet" />
<link href="../JQGridReq/themes/start/theme.css" rel="stylesheet" />
<script type="text/javascript">
jQuery("#jQGridDemo").jqGrid({
url: '../Handlers/JQGridHandler.ashx',
datatype: "json",
colNames: ['TableID', 'Region_ID', 'Region_Name', 'ActionDate', 'Field', 'OldValue', 'NewValue', 'TableName', 'Who','Comment'],
colModel: [
{ name: 'TableID', index: 'TableID', width: 50, stype: 'text' },
{ name: 'Region_ID', index: 'Region_ID', width: 50, stype: 'text', sortable: true, editable: false },
{ name: 'Region_Name', index: 'Region_Name', width: 100, editable: false },
{ name: 'ActionDate', index: 'ActionDate', width: 80, editable: false, formatter: "date" },
{ name: 'Field', index: 'Field', width: 100, align: "right", editable: false },
{ name: 'OldValue', index: 'OldValue', width: 100, align: "right", editable: false },
{ name: 'NewValue', index: 'NewValue', width: 100, align: "right", editable: false },
{ name: 'TableName', index: 'TableName', width: 100, sortable: true, editable: false },
{ name: 'Who', index: 'Who', width: 110, sortable: true, editable: false },
{ name: 'Comment', index: 'Comment', width: 110, sortable: true, editable: false }
],
rowNum: 20,
mtype: 'GET',
loadonce: true,
rowList: [10, 20, 30,40,50],
pager: '#jQGridDemoPager',
sortname: 'TableID',
viewrecords: true,
sortorder: 'desc',
caption: "",
editurl: '../Handlers/JQGridHandler.ashx'
});
$('#jQGridDemo').jqGrid('navGrid', '#jQGridDemoPager',
{
//edit: true,
//add: true,
//del: true,
search: true,
searchtext: "Search"
//addtext: "Add",
//edittext: "Edit",
//deltext:"Delete"
},
{ //EDIT
// height: 300,
// width: 400,
// top: 50,
// left: 100,
// dataheight: 280,
closeOnEscape: true,//Closes the popup on pressing escape key
reloadAfterSubmit: true,
drag: true,
afterSubmit: function (response, postdata) {
if (response.responseText == "") {
$(this).jqGrid('setGridParam', { datatype: 'json' }).trigger('reloadGrid');//Reloads the grid after edit
return [true, '']
}
else {
$(this).jqGrid('setGridParam', { datatype: 'json' }).trigger('reloadGrid'); //Reloads the grid after edit
return [false, response.responseText]//Captures and displays the response text on th Edit window
}
},
//editData: {
// EmpId: function () {
// var sel_id = $('#jQGridDemo').jqGrid('getGridParam', 'selrow');
// var value = $('#jQGridDemo').jqGrid('getCell', sel_id, '_id');
// return value;
// }
//}
},
{
closeAfterAdd: true,//Closes the add window after add
afterSubmit: function (response, postdata) {
if (response.responseText == "") {
$(this).jqGrid('setGridParam', { datatype: 'json' }).trigger('reloadGrid')//Reloads the grid after Add
return [true, '']
}
else {
$(this).jqGrid('setGridParam', { datatype: 'json' }).trigger('reloadGrid')//Reloads the grid after Add
return [false, response.responseText]
}
}
},
{ //DELETE
closeOnEscape: true,
closeAfterDelete: true,
reloadAfterSubmit: true,
closeOnEscape: true,
drag: true,
afterSubmit: function (response, postdata) {
if (response.responseText == "") {
$("#jQGridDemo").trigger("reloadGrid", [{ current: true}]);
return [false, response.responseText]
}
else {
$(this).jqGrid('setGridParam', { datatype: 'json' }).trigger('reloadGrid')
return [true, response.responseText]
}
},
//delData: {
// EmpId: function () {
// var sel_id = $('#jQGridDemo').jqGrid('getGridParam', 'selrow');
// var value = $('#jQGridDemo').jqGrid('getCell', sel_id, '_id');
// return value;
// }
//}
},
{//SEARCH
closeOnEscape: true
}
);
</script>
プロジェクトを右クリックして汎用ハンドラーを作成し、新しいアイテムをGeneric Handlerとして追加し、JQGridHandler.ashxという名前を付けてから、ajax呼び出しを行うためにHandlersという名前のフォルダーに配置しました。
JqGridHandler.ashx.cs：-
public class JQGridHandler : IHttpHandler
{
History myHistory = new History();
public void ProcessRequest(HttpContext context)
{
try {
List<HistoryDetails> myHistoryDetails = new List<HistoryDetails>();
myHistoryDetails = myHistory.GetAllHistoryDetails();
var jsonSerializer = new JavaScriptSerializer();
context.Response.Write(jsonSerializer.Serialize(myHistoryDetails));
}
catch(Exception ex)
{
}
}
public bool IsReusable
{
get
{
return false;
}
}
}
History.aspx.cs：- 必要なすべてのプロパティを持つHistoryDetailsというジェネリッククラスを作成しています。次に、Iamはビジネスロジックを呼び出します。GetallHistoryDetails（）は、ストアドプロシージャを使用してデータベースからレコードを取得します。
public List<HistoryDetails> GetAllHistoryDetails()
{
List<HistoryDetails> myHistoryDetails = new List<HistoryDetails>();
try
{
myHistoryDetails = BusinessLogic.GetAllHistoryDetails(IdVal);
}
catch(Exception ex)
{
}
return myHistoryDetails;
}
参照： -https ：//www.codeproject.com/Articles/609442/Using-JqGrid-in-ASP-NET
于 2017-02-26T21:39:35.257 に答える