2

私はashxファイルでグリッドを塗りつぶし、その作業はうまくいきます。グリッドにアクションを追加すると、セルのデータが右にシフトし、最後の列に Null が表示されます。

アクション追加前

ここに画像の説明を入力

アクション追加後

ここに画像の説明を入力

firebug のグリッド:

ここに画像の説明を入力

灰：

  public void ProcessRequest(HttpContext context) {
            HttpRequest request = context.Request;
            HttpResponse response = context.Response;
            string _search = request["_search"];
            string numberOfRows = request["rows"];
            string pageIndex = request["page"];
            string sortColumnName = request["sidx"];
            string sortOrderBy = request["sord"];
            int totalRecords;
  Collection<User> users = GetDummyUsers(numberOfRows, pageIndex, sortColumnName, sortOrderBy, out totalRecords);
            string output = BuildJQGridResults (users, Convert.ToInt32 (numberOfRows), Convert.ToInt32 (pageIndex), Convert.ToInt32 (totalRecords));
            response.Write (output);
        }

ユーザーの作成:

 private Collection<User> GetDummyUsers(string numberOfRows, string pageIndex, string sortColumnName, string sortOrderBy, out int totalRecords) {
            var data = new Collection<User> {
                new User(){ UserID = 1,UserName = "Bill Gates", FirstName = "Bill", LastName = "Gates",EmailID = "test@microsoft.com",  },
                new User(){ UserID = 1,UserName = "Bill Gates", FirstName = "Bill", LastName = "Gates",EmailID = "test@microsoft.com",  },
                new User(){ UserID = 1,UserName = "Bill Gates", FirstName = "Bill", LastName = "Gates",EmailID = "test@microsoft.com",  },
            };
            totalRecords = data.Count;
            return data;
        }

json に変換:

 private string BuildJQGridResults(Collection<User> users, int numberOfRows, int pageIndex, int totalRecords) {
            JQGridResults result = new JQGridResults ();
            List<JQGridRow> rows = new List<JQGridRow> ();
            foreach (User user in users) {
                JQGridRow row = new JQGridRow ();
                row.id = user.UserID;
                row.cell = new string[5];
                row.cell[0] = user.UserID.ToString ();
                row.cell[1] = user.UserName;
                row.cell[2] = user.FirstName;
                row.cell[3] = user.LastName;
                row.cell[4] = user.EmailID;
                rows.Add (row);
            }
            result.rows = rows.ToArray ();
            result.page = pageIndex;
            result.total = (totalRecords + numberOfRows - 1) / numberOfRows;
            result.records = totalRecords;
            return new JavaScriptSerializer ().Serialize (result);
        }

グリッド：

     url: 'jqGridHandler.ashx',
            datatype: 'json',
            autowidth: true,
            height: 100,
            colNames: ['ACTION', 'ID', 'UserName', 'FirstName', 'LastName', 'EmailID'],
            colModel: [
                         {
                             name: 'act', width: 100, align: 'center', sortable: false, formatter: 'actions',
                             formatoptions: {
                                 keys: true, 
                                 delOptions: true,
                                 delbutton:true,
                                 editbutton:false
                             }
                         },

                          { name: 'UserID', width: 100, sortable: true, },
                        { name: 'UserName', width: 100, sortable: true },
                        { name: 'FirstName', width: 100, sortable: true },
                        { name: 'LastName', width: 100, sortable: true },
                        { name: 'EmailID', width: 100, sortable: true },
            ],
            rowNum: 20,
            loadonce: true,
            rowList: [5, 10, 20],
            recordpos: "left",
            ignoreCase: true,
            toppager: true,
            viewrecords: true,
            sortorder: "desc",
            scrollOffset: 1,
        });
    });
4

3 に答える 3

2

jqGrid はactions実際の列として扱われており、そのデータが必要です。これを解決する最も簡単な方法は、サーバー側の行に空のセルを追加することです:

private string BuildJQGridResults(Collection<User> users, int numberOfRows, int pageIndex, int totalRecords) {
    JQGridResults result = new JQGridResults ();
    List<JQGridRow> rows = new List<JQGridRow> ();
    foreach (User user in users) {
        JQGridRow row = new JQGridRow ();
        row.id = user.UserID;
        row.cell = new string[6];
        row.cell[0] = String.Empty;
        row.cell[1] = user.UserID.ToString ();
        row.cell[2] = user.UserName;
        row.cell[3] = user.FirstName;
        row.cell[4] = user.LastName;
        row.cell[5] = user.EmailID;
        rows.Add (row);
    }
    result.rows = rows.ToArray ();
    result.page = pageIndex;
    result.total = (totalRecords + numberOfRows - 1) / numberOfRows;
    result.records = totalRecords;
    return new JavaScriptSerializer ().Serialize (result);
}

別の方法として、モードで jqGrid を使用できrepeatItems: falseます。まず、jqGrid 初期化スクリプトを変更する必要があります。

$("#UsersGrid").jqGrid({
    url: 'jqGridHandler.ashx',
    datatype: 'json',
    autowidth: true,
    height: 100,
    colNames: ['ACTION', 'ID', 'UserName', 'FirstName', 'LastName', 'EmailID'],
    colModel: [
        { name: 'act', width: 100, align: 'center', sortable: false, formatter: 'actions', formatoptions: { keys: true, delOptions: true, delbutton:true, editbutton:false } },
        { name: 'UserID', width: 100, sortable: true, },
        { name: 'UserName', width: 100, sortable: true },
        { name: 'FirstName', width: 100, sortable: true },
        { name: 'LastName', width: 100, sortable: true },
        { name: 'EmailID', width: 100, sortable: true },
    ],
    rowNum: 20,
    loadonce: true,
    rowList: [5, 10, 20],
    recordpos: 'left',
    ignoreCase: true,
    toppager: true,
    viewrecords: true,
    sortorder: 'desc',
    scrollOffset: 1,
    jsonReader : { 
        repeatitems: false
    }
});

サーバー側では、配列を使用できなくなりました。オブジェクトまたは辞書を使用する必要があります。辞書であるより一般的なアプローチを示します。ソリューションがこのサンプルに基づいていると仮定すると、次JQGridResultのようにクラスを変更する必要があります。

public class JQGridResults
{
    public int page;
    public int total;
    public int records;
    public List<Dictionary<string, string>> rows;
}

メソッドは次のようになります。

private string BuildJQGridResults(Collection<User> users, int numberOfRows, int pageIndex, int totalRecords) {
    JQGridResults result = new JQGridResults();
    result.rows = new List<Dictionary<string, string>>();
    foreach (User user in users) {
        Dictionary<string, string> row = new Dictionary<string, string>();
        row.Add("id", user.UserID.ToString());
        row.Add("UserID", user.UserID.ToString());
        row.Add("UserName", user.UserName);
        row.Add("FirstName", user.FirstName);
        row.Add("LastName", user.LastName);
        row.Add("EmailID", user.EmailID);
        result.rows.Add(row);
    }
    result.page = pageIndex;
    result.total = (totalRecords + numberOfRows - 1) / numberOfRows;
    result.records = totalRecords;
    return new JavaScriptSerializer().Serialize(result);
}

これは、2 回送信することを避けるためにさらに最適化できますUserIdが、これは質問の観点から重要なことではありません。

于 2013-05-06T14:32:49.853 に答える
0

私のブラウザでは、コードは完全に正常に動作します。このコードで試してください。また、webdeveloperツールをチェックインするだけで動作します。エラーが発生していないかどうかを確認してください。myDelOptions のコードも貼り付けます。

$("#datagrid").jqGrid({
            url: 'jqGridHandler.ashx',
            datatype: 'json',
            autowidth: true,
            height: 100,
            colNames: [ 'ACTION', 'EOSysNum', 'PctIndNum', 'PctLettSubject', 'PctAssignSubject', ],
            colModel: [
                         {
                             name: 'act', width: 100, align: 'center', sortable: false, formatter: 'actions',
                             formatoptions: {
                                 keys: true, 
                                 delOptions: true,
                                 delbutton:true,
                                 editbutton:false
                             }
                         },

                         { name: 'EOSysNum', index: 'UserID', width: 50, sortable: true, hidden: false },
                         { name: 'PctIndNum', width: 140, sortable: true },
                         { name: 'PctLettSubject', width: 140, sortable: true },
                         { name: 'PctAssignSubject', width: 100, sortable: true },
                     ],
            rowNum: 20,
            loadonce: true,
            rowList: [5, 10, 20],
            recordpos: "left",
            ignoreCase: true,
            toppager: true,
            viewrecords: true,
            sortorder: "desc",
            scrollOffset: 1,
       });
于 2013-05-06T12:42:11.730 に答える