10

JQuery グリッド プラグイン jqGrid を実装できた人はいますか? 私は JSON ページングを実装しようとしています。近づいているように感じますが、取るに足らない詳細に圧倒されているようにも感じます。誰かがサンプル コードを投稿できれば、非常にありがたいです。

4

8 に答える 8

9

私のプロジェクトでこれをやろうとしているときにあなたの投稿を見つけました。私はそれを働かせました。将来それが必要になる人にとっては、jqGrid はそのままでは JSON と ASP.NET では機能しません。grid.base.js にいくつかの小さな変更を加える必要があります。829 行付近で、json ケース セクションを次のように置き換えます。

case "json":
    gdata = JSON.stringify(gdata); //ASP.NET expects JSON as a string
    $.ajax({ url: ts.p.url, 
             type: ts.p.mtype, 
             dataType: "json", 
             contentType: "application/json; charset=utf-8", //required by ASP.NET
             data: gdata, 
             complete: function(JSON, st) { if (st == "success") { addJSONData(cleanUp(JSON.responseText), ts.grid.bDiv); if (loadComplete) { loadComplete(); } } }, 
             error: function(xhr, st, err) { if (loadError) { loadError(xhr, st, err); } endReq(); }, 
             beforeSend: function(xhr) { if (loadBeforeSend) { loadBeforeSend(xhr); } } });
    if (ts.p.loadonce || ts.p.treeGrid) { ts.p.datatype = "local"; }
    break;

次に、次の関数を追加します。

function cleanUp(responseText) {
    var myObject = JSON.parse(responseText);  //more secure than eval
    return myObject.d;  //ASP.NET special
}

JSON パーサーと stringifierも含める必要があります。ASP.NET での作業に加えて、eval ステートメントがなくなったため、この改訂されたコードはより安全です。

編集: grid.celledit.js、grid.formedit.js、grid.inlinedit.js、および grid.subgrid.js に同様の編集を行う必要がある場合があることにも注意してください。

于 2009-01-11T10:45:51.750 に答える
2

jQuery と ASP.NET を使用してクライアント側のページングを行うための jTemplates を用意しました。私はあなたがここで見つけることができるブログ投稿をしました: http://www.aaron-powell.com/blog.aspx?id=1209

テンプレート化されたデータの場所を作成し、ASP.NET からデータを返し、ページング ソリューションを実装する方法について説明します。

于 2009-01-11T11:42:24.223 に答える
1

ASP.Net MVC JsonResult を使用してグリッドを設定できます。

人物クラス

public class Person
{
    public int ID { get; set; }
    public string Name { get; set; }
    public DateTime Birthday { get; set; }

    public static IEnumerable<Person> GetABunchOfPeople()
    {
       // Get a bunch of People.
    }
}

コントローラーには次のものがあります。

public JsonResult GetABunchOfPeopleAsJson()
{
    var rows = (Person.GetABunchOfPeople()
        .Select(c => new
                         {
                             id = c.ID,
                             cell = new[]
                                        {
                                            c.ID.ToString(),
                                            c.Name,
                                            c.Birthday.ToShortDateString()
                                        }
                         })).ToArray();

    return new JsonResult
               {
                   Data = new
                              {
                                  page = 1,
                                  records = rows.Length,
                                  rows,
                                  total = 1
                              }
               };
}

URL の jqGrid 構成は次のようになります。

url: '<%= ResolveUrl("~/Person/GetAllPeople") %>',
于 2009-04-02T21:05:50.213 に答える
0

私はすべてをまとめようとして困惑しています。私の最初の関心事は、単に正しいJSON応答を生成することです。返されたクラスは「d」という名前のプロパティとしてシリアル化されているようです-これはJQueryのものですか、それともASP.Net Webメソッドの規則ですか？jqGridはトップレベルのデータを探しますが、asp.netはそれを「d」というプロパティに配置します。

    [WebMethod]
    [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
    public static object GetData() {
        TestClass tc = new TestClass() { One = "Hello", Two = "World" };
        return tc;
    }


        $("#divResults").click(function() {
            $.ajax({
                type: "POST",
                url: "GridData_bak.aspx/GetData",
                data: "{}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function(test) {
                    // Replace the div's content with the page method's return.
                    $("#divResults").text(test.d.One);
                },
                error: function(msg) {
                    $("#divResults").text(msg);
                }
            });
        });
于 2008-10-08T01:29:17.257 に答える
0

grid.base.jsやその他のjqgridファイルを変更せずにjqgridをjson＆asp.netで動作させることができると思います。datatypeプロパティを使用して独自のカスタムajax呼び出しを定義し、jsonリーダーを定義する必要があります。グリッドがリロードされるたびに、カスタムajax呼び出しとリーダー。

プロセスはxmlの場合と同様であり、jsonreaderの代わりにxmlreaderを定義するだけです。

jsonreaderのすべてのプロパティは、オンラインドキュメントで定義されています

カスタムデータ型の例については、ライブデモページの「3.3の新機能」の「データ型として機能」を参照してください。

于 2009-01-11T19:24:56.070 に答える
0

私の実装：

data： "{'page'：'" + gdata.page + "'、'rows'：'" + gdata.rows + "'、'sidx'：'" + gdata.sidx + "'、'sord'： '"+ gdata.sord +"'、'nd'：'" + gdata.nd +"'、'_search'：'" + gdata._search +"'、'searchField'：'" + ts.p.searchdata .searchField + "'、' searchString'：'" + ts.p.searchdata.searchString + "'、' searchOper'：'" + ts.p.searchdata.searchOper + "'}"、

成功：function（JSON、st）{if（st == "success"）{addJSONData（JSON.d、ts.grid.bDiv）; if（loadComplete）{loadComplete（）; }}

完全なajaxイベント使用成功イベントを使用して挿入されます。この方法は、二重のjsonがセラライズするのを防ぎます。

セルの編集で気づかなかったことが1つだけあります。同じデータ型（int）の複数のセルを編集したいとします。Webメソッドは1つしかありません！異なる名前の同じデータ型でoveloadすることはできません！誰かがこの種の問題を解決しますか？

于 2009-01-28T07:29:36.093 に答える
0

json の d は、潜在的なエクスプロイトに対する組み込みの防御です。

mvcを使用していることがわかった例

完全な情報はこちら

于 2008-11-21T14:34:37.153 に答える
0

flexgrid プラグインはドキュメント上では非常にまばらですが、デモ ページの小さなセクションに json シリアル化されたオブジェクトの作成に関する説明があります。グリッドには特定の形式が必要なため、これは少し誤解を招く可能性があります。xml オプションの php コードを移植しました。少しモンキー グリースを使用すると、json の書式設定についても同じことができます

ここに私のxmlポートがあります

the setup for the grid
 $("#tableToFlex").flexigrid({
                 url: 'WebService.asmx/getData'}
                   ... *other configs* ...);

webservice.asmx クラスの次のコードを検討してください。

<WebMethod()> _
<ScriptMethod(ResponseFormat:=ResponseFormat.Xml)> _
Public Function getData(ByVal page As Integer, _
    ByVal qtype As String, _
    ByVal Query As String, _
    ByVal rp As Integer, _
    ByVal sortname As String, _
    ByVal sortorder As String) As System.Xml.XmlDocument
    'note these parameters are inputted to determine paging and constrains for the   resultant rows

    'Sample list to send to the grid
    Dim list = New List(Of ApplicationStateInformation)
    'Sample row object that holds name , surname , address, idnumber ...
    list.Add(New RowObjects( "test1", "test1", "test1", "12345"))
    list.Add(New RowObjects( "test2", "test2", "test2", "12345"))
    list.Add(New RowObjects( "test3", "test3", "test3", "12345"))
    list.Add(New RowObjects( "test4", "test4", "test4", "12345"))
    'retun a xml doc, as we are using the xml format on the flexgrid

    Dim returnDoc = New System.Xml.XmlDocument()
    returnDoc.Load(New IO.StringReader(ToXmlResult(list)))
    Return returnDoc
End Function

Private Function ToXmlResult(ByVal list As List(Of RowObjects)) As String
    'this is the xml document format the grid understands
    Dim result As String = "<?xml version=""1.0"" encoding=""utf-8""?>" & vbCrLf
    result += "<rows>" & vbCrLf
    result += String.Format("<page>{0}</page>" & vbCrLf, "1")
    result += String.Format("<total>{0}</total>" & vbCrLf, "10")
    For Each item In list
        result += ConvertRowData(item)
    Next
    result += "</rows>" & vbCrLf
    Return result
End Function

Private Function ConvertRowData(ByVal row As RowObjects) As String

    Dim result As String = String.Format("<row id='{0}'>" & vbCrLf, row.IdNumber.ToString)
    'THESE SHOULD BE HTML ENCODED (the format arg) but I left it out
    result += String.Format("<cell><![CDATA[{0}]]></cell>" & vbCrLf, row.Name)
    result += String.Format("<cell><![CDATA[{0}]]></cell>" & vbCrLf, row.Surname)
    result += String.Format("<cell><![CDATA[{0}]]></cell>" & vbCrLf, row.IdNumber)

    result += "</row>" & vbCrLf
    Return result
End Function
于 2008-11-21T13:04:05.370 に答える