1

私はjqGrid v4.5.2を使用しており、同封されているのは壊れたグループ化の2つのスナップショットです。使用したソースコードを同封します。var jsonData = {...} テストケース データを Web サーバーの応答 json データとして使用します。

//テストケース #1 (年ごとのグループ) --> 2001 年を繰り返します。代わりに、"2001" の 1 つのグループにする必要があります。 ここに画像の説明を入力

//テストケース #2 (ロケーションごとにグループ化) --> 1 グループではなく 3 グループの空白データ。 ここに画像の説明を入力

<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" /> <!-- This force IE to use the latest version of HTML, CSS and JavaScript instead of being forced to use 1 specific IE version only --> 
<title>Testcase</title>
<link rel="stylesheet" type="text/css" href="../css/jquery-ui-v1.10.3.themes/redmond/jquery-ui-1.10.3.custom.min.css" />  
<link rel="stylesheet" type="text/css" href="../css/jqgrid-v4.5.2/ui.multiselect.css" />  
<link rel="stylesheet" type="text/css" href="../css/jqgrid-v4.5.2/ui.jqgrid.css" />  
<script type="text/javascript" src="../scripts/jquery-v2.0.0.min.js"></script>
<script src="../scripts/jquery-ui-v1.10.3.themes/redmond/jquery-ui-1.10.3.custom.min.js" type="text/javascript"></script>
<script src="../scripts/jqgrid-v4.5.2/ui.multiselect.js" type="text/javascript"></script>
<script src="../scripts/jqgrid-v4.5.2/i18n/grid.locale-en.js" type="text/javascript"></script>
<script src="../scripts/jqgrid-v4.5.2/jquery.jqGrid.src.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function () {
        var jqgridSpreadsheetId = 'MyInventoryJqgrid_Spreadsheet';
        var jqgridGroupColumnHeader = 'MyInventoryJqgrid_GroupColumnHeader';
        var jsonData = { "page": 1, "total": 1, "records": 517, "rows": [{ "id": 1, "cell": ["2005", ""] }, { "id": 2, "cell": ["2000", ""] }, { "id": 3, "cell": ["2009", ""] }, { "id": 4, "cell": ["2002", ""] }, { "id": 5, "cell": ["2000", ""] }, { "id": 6, "cell": ["1998", ""] }, { "id": 7, "cell": ["1993", ""] }, { "id": 8, "cell": ["1999", ""] }, { "id": 9, "cell": ["2006", ""] }, { "id": 10, "cell": ["2005", ""] }, { "id": 11, "cell": ["2004", ""] }, { "id": 12, "cell": ["2003", ""] }, { "id": 13, "cell": ["1989", ""] }, { "id": 14, "cell": ["2003", ""] }, { "id": 15, "cell": ["2002", ""] }, { "id": 16, "cell": ["2004", ""] }, { "id": 17, "cell": ["2001", ""] }, { "id": 18, "cell": ["2004", ""] }, { "id": 19, "cell": ["2005", ""] }, { "id": 20, "cell": ["2005", ""] }, { "id": 21, "cell": ["2000", ""] }, { "id": 22, "cell": ["2001", ""] }, { "id": 23, "cell": ["2007", ""] }, { "id": 24, "cell": ["2004", ""] }, { "id": 25, "cell": ["2000", ""] }, { "id": 26, "cell": ["2001", ""] }, { "id": 27, "cell": ["2004", ""] }, { "id": 28, "cell": ["2005", ""] }, { "id": 29, "cell": ["2003", ""] }, { "id": 30, "cell": ["2005", ""] }, { "id": 31, "cell": ["2002", ""] }, { "id": 32, "cell": ["2001", ""] }, { "id": 33, "cell": ["2003", ""] }, { "id": 34, "cell": ["2002", ""] }, { "id": 35, "cell": ["2004", ""] }, { "id": 36, "cell": ["2002", ""] }, { "id": 37, "cell": ["2002", ""] }, { "id": 38, "cell": ["2003", ""] }, { "id": 39, "cell": ["2007", ""] }, { "id": 40, "cell": ["2001", ""] }, { "id": 41, "cell": ["2001", ""] }, { "id": 42, "cell": ["2007", ""] }, { "id": 43, "cell": ["2003", ""] }, { "id": 44, "cell": ["2008", ""] }, { "id": 45, "cell": ["2003", ""] }, { "id": 46, "cell": ["2003", ""] }, { "id": 47, "cell": ["2000", ""] }, { "id": 48, "cell": ["2007", ""] }, { "id": 49, "cell": ["2004", ""] }, { "id": 50, "cell": ["2002", ""] }, { "id": 51, "cell": ["2001", ""] }, { "id": 52, "cell": ["2006", ""] }, { "id": 53, "cell": ["2002", ""] }, { "id": 54, "cell": ["2004", ""] }, { "id": 55, "cell": ["2000", ""] }, { "id": 56, "cell": ["2002", ""] }, { "id": 57, "cell": ["2005", ""] }, { "id": 58, "cell": ["1999", ""] }, { "id": 59, "cell": ["2006", ""] }, { "id": 60, "cell": ["2005", ""] }, { "id": 61, "cell": ["1995", ""] }, { "id": 62, "cell": ["2001", ""] }, { "id": 63, "cell": ["2002", ""] }, { "id": 64, "cell": ["2001", ""] }, { "id": 65, "cell": ["1997", ""] }, { "id": 66, "cell": ["1995", ""] }, { "id": 67, "cell": ["1991", ""] }, { "id": 68, "cell": ["2003", ""] }, { "id": 69, "cell": ["1997", ""] }, { "id": 70, "cell": ["2000", ""] }, { "id": 71, "cell": ["2005", ""] }, { "id": 72, "cell": ["2000", ""] }, { "id": 73, "cell": ["1996", ""] }, { "id": 74, "cell": ["1997", ""] }, { "id": 75, "cell": ["1995", ""] }, { "id": 76, "cell": ["1994", ""] }, { "id": 77, "cell": ["2006", ""] }, { "id": 78, "cell": ["2001", ""] }, { "id": 79, "cell": ["2002", ""] }, { "id": 80, "cell": ["1994", ""] }, { "id": 81, "cell": ["2006", ""] }, { "id": 82, "cell": ["1999", ""] }, { "id": 83, "cell": ["2001", ""] }, { "id": 84, "cell": ["2001", ""] }, { "id": 85, "cell": ["2004", ""] }, { "id": 86, "cell": ["1994", ""] }, { "id": 87, "cell": ["2000", ""] }, { "id": 88, "cell": ["2002", ""] }, { "id": 89, "cell": ["2002", ""] }, { "id": 90, "cell": ["2006", ""] }, { "id": 91, "cell": ["1997", ""] }, { "id": 92, "cell": ["2001", ""] }, { "id": 93, "cell": ["2007", ""] }, { "id": 94, "cell": ["2004", ""] }, { "id": 95, "cell": ["1999", ""] }, { "id": 96, "cell": ["2002", ""] }, { "id": 97, "cell": ["2002", ""] }, { "id": 98, "cell": ["1994", ""] }, { "id": 99, "cell": ["2005", ""] }, { "id": 100, "cell": ["1996", ""] }, { "id": 101, "cell": ["2003", ""] }, { "id": 102, "cell": ["2004", ""] }, { "id": 103, "cell": ["2006", ""] }, { "id": 104, "cell": ["2003", ""] }, { "id": 105, "cell": ["2004", ""] }, { "id": 106, "cell": ["2002", ""] }, { "id": 107, "cell": ["2005", ""] }, { "id": 108, "cell": ["2002", ""] }, { "id": 109, "cell": ["2000", ""] }, { "id": 110, "cell": ["2003", ""] }, { "id": 111, "cell": ["2005", ""] }, { "id": 112, "cell": ["2004", ""] }, { "id": 113, "cell": ["2000", ""] }, { "id": 114, "cell": ["2002", ""] }, { "id": 115, "cell": ["2006", ""] }, { "id": 116, "cell": ["2005", ""] }, { "id": 117, "cell": ["2004", ""] }, { "id": 118, "cell": ["2004", ""] }, { "id": 119, "cell": ["2008", ""] }, { "id": 120, "cell": ["2002", ""] }, { "id": 121, "cell": ["2005", ""] }, { "id": 122, "cell": ["2004", ""] }, { "id": 123, "cell": ["2000", ""] }, { "id": 124, "cell": ["2005", ""] }, { "id": 125, "cell": ["2001", ""] }, { "id": 126, "cell": ["2003", ""] }, { "id": 127, "cell": ["2001", ""] }, { "id": 128, "cell": ["2005", ""] }, { "id": 129, "cell": ["2005", ""] }, { "id": 130, "cell": ["2002", ""] }, { "id": 131, "cell": ["2002", ""] }, { "id": 132, "cell": ["2000", ""] }, { "id": 133, "cell": ["2004", ""] }, { "id": 134, "cell": ["2000", ""] }, { "id": 135, "cell": ["1998", ""] }, { "id": 136, "cell": ["2005", ""] }, { "id": 137, "cell": ["2001", ""] }, { "id": 138, "cell": ["2003", ""] }, { "id": 139, "cell": ["1996", ""] }, { "id": 140, "cell": ["2004", ""] }, { "id": 141, "cell": ["2002", ""] }, { "id": 142, "cell": ["1999", ""] }, { "id": 143, "cell": ["2001", ""] }, { "id": 144, "cell": ["1999", ""] }, { "id": 145, "cell": ["2001", ""] }, { "id": 146, "cell": ["2002", ""] }, { "id": 147, "cell": ["2004", ""] }, { "id": 148, "cell": ["2003", ""] }, { "id": 149, "cell": ["2005", ""] }, { "id": 150, "cell": ["2005", ""] }, { "id": 151, "cell": ["2003", ""] }, { "id": 152, "cell": ["2002", ""] }, { "id": 153, "cell": ["2001", ""] }, { "id": 154, "cell": ["2000", ""] }, { "id": 155, "cell": ["2001", ""] }, { "id": 156, "cell": ["2000", ""] }, { "id": 157, "cell": ["2004", ""] }, { "id": 158, "cell": ["1998", ""] }, { "id": 159, "cell": ["2003", ""] }, { "id": 160, "cell": ["2002", ""] }, { "id": 161, "cell": ["1990", ""] }, { "id": 162, "cell": ["2002", ""] }, { "id": 163, "cell": ["2002", ""] }, { "id": 164, "cell": ["2002", ""] }, { "id": 165, "cell": ["2005", ""] }, { "id": 166, "cell": ["2005", ""] }, { "id": 167, "cell": ["1998", ""] }, { "id": 168, "cell": ["2001", ""] }, { "id": 169, "cell": ["2001", ""] }, { "id": 170, "cell": ["2001", ""] }, { "id": 171, "cell": ["2001", ""] }, { "id": 172, "cell": ["2005", ""] }, { "id": 173, "cell": ["2005", ""] }, { "id": 174, "cell": ["2003", ""] }, { "id": 175, "cell": ["2001", ""] }, { "id": 176, "cell": ["2008", ""] }, { "id": 177, "cell": ["2000", ""] }, { "id": 178, "cell": ["2005", ""] }, { "id": 179, "cell": ["2002", ""] }, { "id": 180, "cell": ["2006", ""] }, { "id": 181, "cell": ["2002", ""] }, { "id": 182, "cell": ["2001", ""] }, { "id": 183, "cell": ["1998", ""] }, { "id": 184, "cell": ["2001", ""] }, { "id": 185, "cell": ["2000", ""] }, { "id": 186, "cell": ["2002", ""] }, { "id": 187, "cell": ["2003", ""] }, { "id": 188, "cell": ["2006", ""] }, { "id": 189, "cell": ["2004", ""] }, { "id": 190, "cell": ["1999", ""] }, { "id": 191, "cell": ["2004", ""] }, { "id": 192, "cell": ["2003", ""] }, { "id": 193, "cell": ["2000", ""] }, { "id": 194, "cell": ["2001", ""] }, { "id": 195, "cell": ["2002", ""] }, { "id": 196, "cell": ["2002", ""] }, { "id": 197, "cell": ["2000", ""] }, { "id": 198, "cell": ["2001", ""] }, { "id": 199, "cell": ["1998", ""] }, { "id": 200, "cell": ["2002", ""] }, { "id": 201, "cell": ["2002", ""] }, { "id": 202, "cell": ["2000", ""] }, { "id": 203, "cell": ["2001", ""] }, { "id": 204, "cell": ["2004", ""] }, { "id": 205, "cell": ["2005", ""] }, { "id": 206, "cell": ["2004", ""] }, { "id": 207, "cell": ["2004", ""] }, { "id": 208, "cell": ["1999", ""] }, { "id": 209, "cell": ["2000", ""] }, { "id": 210, "cell": ["2003", ""] }, { "id": 211, "cell": ["2003", ""] }, { "id": 212, "cell": ["2008", ""] }, { "id": 213, "cell": ["2006", ""] }, { "id": 214, "cell": ["2000", ""] }, { "id": 215, "cell": ["2007", ""] }, { "id": 216, "cell": ["2003", ""] }, { "id": 217, "cell": ["2003", ""] }, { "id": 218, "cell": ["2000", ""] }, { "id": 219, "cell": ["1996", ""] }, { "id": 220, "cell": ["2005", ""] }, { "id": 221, "cell": ["1998", ""] }, { "id": 222, "cell": ["1994", ""] }, { "id": 223, "cell": ["1999", ""] }, { "id": 224, "cell": ["2002", ""] }, { "id": 225, "cell": ["2005", ""] }, { "id": 226, "cell": ["2008", ""] }, { "id": 227, "cell": ["2005", ""] }, { "id": 228, "cell": ["2004", ""] }, { "id": 229, "cell": ["2002", ""] }, { "id": 230, "cell": ["2000", ""] }, { "id": 231, "cell": ["2001", ""] }, { "id": 232, "cell": ["2005", ""] }, { "id": 233, "cell": ["2001", ""] }, { "id": 234, "cell": ["2003", ""] }, { "id": 235, "cell": ["2002", ""] }, { "id": 236, "cell": ["2002", ""] }, { "id": 237, "cell": ["2001", ""] }, { "id": 238, "cell": ["2003", ""] }, { "id": 239, "cell": ["2003", ""] }, { "id": 240, "cell": ["2004", ""] }, { "id": 241, "cell": ["2004", ""] }, { "id": 242, "cell": ["1997", ""] }, { "id": 243, "cell": ["2000", ""] }, { "id": 244, "cell": ["2000", ""] }, { "id": 245, "cell": ["2001", ""] }, { "id": 246, "cell": ["2006", ""] }, { "id": 247, "cell": ["2004", ""] }, { "id": 248, "cell": ["2003", ""] }, { "id": 249, "cell": ["2000", ""] }, { "id": 250, "cell": ["2005", ""] }, { "id": 251, "cell": ["2001", ""] }, { "id": 252, "cell": ["1999", ""] }, { "id": 253, "cell": ["2005", ""] }, { "id": 254, "cell": ["2003", ""] }, { "id": 255, "cell": ["2001", ""] }, { "id": 256, "cell": ["2002", ""] }, { "id": 257, "cell": ["2000", ""] }, { "id": 258, "cell": ["2000", ""] }, { "id": 259, "cell": ["2006", ""] }, { "id": 260, "cell": ["2002", ""] }, { "id": 261, "cell": ["2003", ""] }, { "id": 262, "cell": ["2003", ""] }, { "id": 263, "cell": ["2003", ""] }, { "id": 264, "cell": ["1996", ""] }, { "id": 265, "cell": ["2003", ""] }, { "id": 266, "cell": ["2002", ""] }, { "id": 267, "cell": ["2002", ""] }, { "id": 268, "cell": ["2001", ""] }, { "id": 269, "cell": ["2003", ""] }, { "id": 270, "cell": ["2004", ""] }, { "id": 271, "cell": ["2004", ""] }, { "id": 272, "cell": ["2004", ""] }, { "id": 273, "cell": ["2003", ""] }, { "id": 274, "cell": ["2006", ""] }, { "id": 275, "cell": ["2001", ""] }, { "id": 276, "cell": ["2002", ""] }, { "id": 277, "cell": ["2003", ""] }, { "id": 278, "cell": ["2003", ""] }, { "id": 279, "cell": ["1999", ""] }, { "id": 280, "cell": ["2003", ""] }, { "id": 281, "cell": ["2003", ""] }, { "id": 282, "cell": ["2003", ""] }, { "id": 283, "cell": ["2003", ""] }, { "id": 284, "cell": ["2006", ""] }, { "id": 285, "cell": ["2004", ""] }, { "id": 286, "cell": ["2002", ""] }, { "id": 287, "cell": ["2002", ""] }, { "id": 288, "cell": ["2004", ""] }, { "id": 289, "cell": ["1998", ""] }, { "id": 290, "cell": ["2000", ""] }, { "id": 291, "cell": ["2006", ""] }, { "id": 292, "cell": ["2003", ""] }, { "id": 293, "cell": ["2002", ""] }, { "id": 294, "cell": ["2006", ""] }, { "id": 295, "cell": ["2004", ""] }, { "id": 296, "cell": ["2001", ""] }, { "id": 297, "cell": ["2006", ""] }, { "id": 298, "cell": ["2001", ""] }, { "id": 299, "cell": ["2004", ""] }, { "id": 300, "cell": ["2002", ""] }, { "id": 301, "cell": ["2003", ""] }, { "id": 302, "cell": ["2005", ""] }, { "id": 303, "cell": ["2005", ""] }, { "id": 304, "cell": ["2001", ""] }, { "id": 305, "cell": ["2003", ""] }, { "id": 306, "cell": ["2001", ""] }, { "id": 307, "cell": ["2005", ""] }, { "id": 308, "cell": ["2000", ""] }, { "id": 309, "cell": ["2004", ""] }, { "id": 310, "cell": ["1999", ""] }, { "id": 311, "cell": ["2006", ""] }, { "id": 312, "cell": ["2005", ""] }, { "id": 313, "cell": ["2001", ""] }, { "id": 314, "cell": ["2003", ""] }, { "id": 315, "cell": ["2002", ""] }, { "id": 316, "cell": ["2005", ""] }, { "id": 317, "cell": ["2004", ""] }, { "id": 318, "cell": ["1997", ""] }, { "id": 319, "cell": ["2005", ""] }, { "id": 320, "cell": ["2003", ""] }, { "id": 321, "cell": ["2001", ""] }, { "id": 322, "cell": ["2005", ""] }, { "id": 323, "cell": ["1999", ""] }, { "id": 324, "cell": ["2004", ""] }, { "id": 325, "cell": ["2004", ""] }, { "id": 326, "cell": ["2005", ""] }, { "id": 327, "cell": ["2006", ""] }, { "id": 328, "cell": ["2002", ""] }, { "id": 329, "cell": ["2004", ""] }, { "id": 330, "cell": ["1999", ""] }, { "id": 331, "cell": ["2002", ""] }, { "id": 332, "cell": ["2003", ""] }, { "id": 333, "cell": ["2002", ""] }, { "id": 334, "cell": ["2005", ""] }, { "id": 335, "cell": ["2006", ""] }, { "id": 336, "cell": ["2002", ""] }, { "id": 337, "cell": ["2000", ""] }, { "id": 338, "cell": ["2003", ""] }, { "id": 339, "cell": ["2003", ""] }, { "id": 340, "cell": ["1999", ""] }, { "id": 341, "cell": ["2003", ""] }, { "id": 342, "cell": ["2005", ""] }, { "id": 343, "cell": ["1999", ""] }, { "id": 344, "cell": ["2005", ""] }, { "id": 345, "cell": ["2003", ""] }, { "id": 346, "cell": ["2001", ""] }, { "id": 347, "cell": ["1999", ""] }, { "id": 348, "cell": ["2004", ""] }, { "id": 349, "cell": ["2002", ""] }, { "id": 350, "cell": ["2004", ""] }, { "id": 351, "cell": ["2002", ""] }, { "id": 352, "cell": ["2001", ""] }, { "id": 353, "cell": ["2002", ""] }, { "id": 354, "cell": ["1999", ""] }, { "id": 355, "cell": ["2006", ""] }, { "id": 356, "cell": ["2000", ""] }, { "id": 357, "cell": ["2000", ""] }, { "id": 358, "cell": ["2004", ""] }, { "id": 359, "cell": ["2005", ""] }, { "id": 360, "cell": ["1999", ""] }, { "id": 361, "cell": ["2000", ""] }, { "id": 362, "cell": ["2003", ""] }, { "id": 363, "cell": ["2003", ""] }, { "id": 364, "cell": ["2001", ""] }, { "id": 365, "cell": ["2004", ""] }, { "id": 366, "cell": ["2001", ""] }, { "id": 367, "cell": ["2003", ""] }, { "id": 368, "cell": ["2004", ""] }, { "id": 369, "cell": ["2000", ""] }, { "id": 370, "cell": ["2004", ""] }, { "id": 371, "cell": ["2002", ""] }, { "id": 372, "cell": ["1995", ""] }, { "id": 373, "cell": ["2006", ""] }, { "id": 374, "cell": ["2001", ""] }, { "id": 375, "cell": ["2000", ""] }, { "id": 376, "cell": ["2006", ""] }, { "id": 377, "cell": ["2005", ""] }, { "id": 378, "cell": ["2000", ""] }, { "id": 379, "cell": ["2003", ""] }, { "id": 380, "cell": ["2002", ""] }, { "id": 381, "cell": ["1999", ""] }, { "id": 382, "cell": ["2002", ""] }, { "id": 383, "cell": ["2002", ""] }, { "id": 384, "cell": ["2001", ""] }, { "id": 385, "cell": ["2002", ""] }, { "id": 386, "cell": ["1998", ""] }, { "id": 387, "cell": ["2006", ""] }, { "id": 388, "cell": ["2004", ""] }, { "id": 389, "cell": ["2001", ""] }, { "id": 390, "cell": ["2003", ""] }, { "id": 391, "cell": ["2000", ""] }, { "id": 392, "cell": ["1999", ""] }, { "id": 393, "cell": ["2002", ""] }, { "id": 394, "cell": ["2001", ""] }, { "id": 395, "cell": ["2001", ""] }, { "id": 396, "cell": ["2003", ""] }, { "id": 397, "cell": ["2001", ""] }, { "id": 398, "cell": ["2005", ""] }, { "id": 399, "cell": ["2003", ""] }, { "id": 400, "cell": ["2005", ""] }, { "id": 401, "cell": ["2008", ""] }, { "id": 402, "cell": ["2003", ""] }, { "id": 403, "cell": ["2003", ""] }, { "id": 404, "cell": ["2003", ""] }, { "id": 405, "cell": ["2004", ""] }, { "id": 406, "cell": ["1999", ""] }, { "id": 407, "cell": ["2004", ""] }, { "id": 408, "cell": ["2001", ""] }, { "id": 409, "cell": ["1999", ""] }, { "id": 410, "cell": ["2000", ""] }, { "id": 411, "cell": ["2005", ""] }, { "id": 412, "cell": ["2003", ""] }, { "id": 413, "cell": ["2003", ""] }, { "id": 414, "cell": ["2005", ""] }, { "id": 415, "cell": ["2005", ""] }, { "id": 416, "cell": ["2000", ""] }, { "id": 417, "cell": ["1997", ""] }, { "id": 418, "cell": ["2006", ""] }, { "id": 419, "cell": ["2000", ""] }, { "id": 420, "cell": ["2004", ""] }, { "id": 421, "cell": ["1999", ""] }, { "id": 422, "cell": ["2004", ""] }, { "id": 423, "cell": ["2000", ""] }, { "id": 424, "cell": ["2002", ""] }, { "id": 425, "cell": ["2002", ""] }, { "id": 426, "cell": ["1998", ""] }, { "id": 427, "cell": ["2002", ""] }, { "id": 428, "cell": ["2003", ""] }, { "id": 429, "cell": ["2002", ""] }, { "id": 430, "cell": ["2005", ""] }, { "id": 431, "cell": ["2001", ""] }, { "id": 432, "cell": ["1998", ""] }, { "id": 433, "cell": ["2002", ""] }, { "id": 434, "cell": ["2003", ""] }, { "id": 435, "cell": ["2002", ""] }, { "id": 436, "cell": ["1999", ""] }, { "id": 437, "cell": ["1998", ""] }, { "id": 438, "cell": ["2002", ""] }, { "id": 439, "cell": ["2003", ""] }, { "id": 440, "cell": ["2001", ""] }, { "id": 441, "cell": ["2003", ""] }, { "id": 442, "cell": ["2002", ""] }, { "id": 443, "cell": ["2002", ""] }, { "id": 444, "cell": ["2002", ""] }, { "id": 445, "cell": ["2005", ""] }, { "id": 446, "cell": ["2009", ""] }, { "id": 447, "cell": ["1999", ""] }, { "id": 448, "cell": ["2001", ""] }, { "id": 449, "cell": ["1996", ""] }, { "id": 450, "cell": ["1998", ""] }, { "id": 451, "cell": ["2000", ""] }, { "id": 452, "cell": ["2008", ""] }, { "id": 453, "cell": ["2005", ""] }, { "id": 454, "cell": ["2001", ""] }, { "id": 455, "cell": ["2003", ""] }, { "id": 456, "cell": ["2003", ""] }, { "id": 457, "cell": ["1998", ""] }, { "id": 458, "cell": ["2004", ""] }, { "id": 459, "cell": ["2001", ""] }, { "id": 460, "cell": ["1999", ""] }, { "id": 461, "cell": ["2003", ""] }, { "id": 462, "cell": ["1999", ""] }, { "id": 463, "cell": ["2000", ""] }, { "id": 464, "cell": ["2004", ""] }, { "id": 465, "cell": ["2006", ""] }, { "id": 466, "cell": ["2001", ""] }, { "id": 467, "cell": ["2001", ""] }, { "id": 468, "cell": ["1999", ""] }, { "id": 469, "cell": ["2006", ""] }, { "id": 470, "cell": ["2002", ""] }, { "id": 471, "cell": ["2001", ""] }, { "id": 472, "cell": ["2006", ""] }, { "id": 473, "cell": ["2006", ""] }, { "id": 474, "cell": ["2002", ""] }, { "id": 475, "cell": ["2004", ""] }, { "id": 476, "cell": ["2005", ""] }, { "id": 477, "cell": ["2000", ""] }, { "id": 478, "cell": ["2001", ""] }, { "id": 479, "cell": ["2003", ""] }, { "id": 480, "cell": ["2004", ""] }, { "id": 481, "cell": ["2004", ""] }, { "id": 482, "cell": ["2000", ""] }, { "id": 483, "cell": ["2003", ""] }, { "id": 484, "cell": ["2008", ""] }, { "id": 485, "cell": ["2005", ""] }, { "id": 486, "cell": ["2002", ""] }, { "id": 487, "cell": ["1999", ""] }, { "id": 488, "cell": ["2003", ""] }, { "id": 489, "cell": ["2004", ""] }, { "id": 490, "cell": ["2005", ""] }, { "id": 491, "cell": ["2003", ""] }, { "id": 492, "cell": ["2005", ""] }, { "id": 493, "cell": ["2006", ""] }, { "id": 494, "cell": ["2003", ""] }, { "id": 495, "cell": ["2000", ""] }, { "id": 496, "cell": ["2000", ""] }, { "id": 497, "cell": ["2001", ""] }, { "id": 498, "cell": ["2004", ""] }, { "id": 499, "cell": ["2002", ""] }, { "id": 500, "cell": ["2005", ""] }, { "id": 501, "cell": ["2000", ""] }, { "id": 502, "cell": ["2006", ""] }, { "id": 503, "cell": ["2001", ""] }, { "id": 504, "cell": ["2000", ""] }, { "id": 505, "cell": ["2001", ""] }, { "id": 506, "cell": ["2002", ""] }, { "id": 507, "cell": ["2003", ""] }, { "id": 508, "cell": ["2006", ""] }, { "id": 509, "cell": ["2004", ""] }, { "id": 510, "cell": ["2002", ""] }, { "id": 511, "cell": ["2001", ""] }, { "id": 512, "cell": ["2001", ""] }, { "id": 513, "cell": ["2003", "San Francisco"] }, { "id": 514, "cell": ["2005", ""] }, { "id": 515, "cell": ["2000", ""] }, { "id": 516, "cell": ["2002", ""] }, { "id": 517, "cell": ["2004", "Jacksonville"] }] };

                    $('#' + jqgridSpreadsheetId).jqGrid({
            url: "zzjqGrid3.ashx",
            mtype: 'POST',
            postData: { WhichJqgridTemplate: 'MyInventory', WebpageQuickQuoteSalePrice: '' },
            jsonReader: { repeatitems: false },
            colNames: ['Year','Inventory Tracker Location'],
            colModel: [
                { jsonmap: function (o) { return o.cell[0]; }, name: 'Year', index: 'Year', sorttype: 'int', align: 'center', searchoptions: { sopt: ['eq', 'ne'] } },
                { jsonmap: function (o) { return o.cell[1]; }, name: 'InventoryTrackerLocation', index: 'InventoryTrackerLocation', sorttype: 'text', align: 'center' }
            ],
            rowNum: -1, //10,
            rowList: [],  //Disable page size dropdown...
            pgbuttons: false,  //Disable page control like next, back button...
            pgtext: null,  //Disable pager text line like "Page 0 of 10"...
            viewrecords: false,  //Disable current view record text like 'View 1-10 of 100'...
            caption: 'My Inventory',
            width: 1022,
            shrinkToFit: false, 
            forceFit: false,  
            autoWidth: false,
            height: 400,
            sortable: false,  /* Do not allow header-column to shift sideway..  Makes it harder for draggable Group-Header-Column features to work... */  /* Discontinued - This allows both 1) Moving columns sideway to other location fields and 2) for jqGrid Column Chooser Plugin / JQuery Multiselect Plugin to work... */
            grouping: true,  /* This allows row data to be group into row grouping... */
            loadonce: false//,  /* 06/10/2013 - Set it to false from now on...  It is learned that having loadonce:true is not worth the trouble when using search feature, delete feature, etc. so we're better off having client-side do both 1) jqGrid ajaxGridOption and 2) server-side querying to do the heavy work for us... */
            ajaxGridOptions: {
                beforeSend: function (xhr) { }, //ftnThrobblerAnimationBegin2(); },
                complete: function (xhr) { }, //ftnThrobblerAnimationEnd2(); },
                error: function (xhr) {
                    alert(xhr); alert("An error had occurred, please try again or notify webmaster of this error");
                } //ftnThrobblerAnimationEnd2(); }
            },
        });

        //[Initialize Group Columns Header]...
        $('#' + jqgridGroupColumnHeader).addClass("ui-widget-content");
        $('#' + jqgridGroupColumnHeader).html("<ul><li class='placeholder'>Drop header columns here</li></ul>");
        $('#' + jqgridGroupColumnHeader).css('width', $('#' + jqgridSpreadsheetId).jqGrid('getGridParam', 'width'));  //Set width of GroupColumnHeader to match jqGrid's width...

        //[Drag a column]...
        $('tr.ui-jqgrid-labels th div').draggable({
            appendTo: 'body',
            helper: 'clone',
            start: function (e, ui) { ui.helper.addClass("ui-state-default ui-th-column ui-th-ltr JqgridGroupColumnHeader_DragNDropEffect"); },  
            //cursorAt: { top: Math.floor(ui.helper.height() / 2), left: Math.floor(ui.helper.width() / 2) }
            //cursorAt: { top: ui.helper.height, left: 0 }
            cursorAt: { bottom: 1, right: 1 },
            cursor: "pointer"
        });

        //[Drop a column]...
        $('#' + jqgridGroupColumnHeader + ' ul').droppable({
            activeClass: 'ui-state-default',
            hoverClass: 'ui-state-hover',
            accept: ':not(.ui-sortable-helper)',
            drop: function (event, ui) {
                var $this = $(this);
                $this.find('.placeholder').remove();
                var groupingColumn = $('<li></li>').attr('data-column', ui.draggable.attr('id').replace('jqgh_' + jqgridSpreadsheetId + '_', ''));
                $('<span class="ui-icon ui-icon-close" style="display:inline-block;"></span>').click(function () {
                    $(this).parent().remove();
                    jqgridGroupColumnHeader_GroupingRemove();
                    jqgridGroupColumnHeader_GroupingGroupBy(
                        $('#' + jqgridGroupColumnHeader + ' ul li:not(.placeholder)').map(function () { return $(this).attr('data-column'); }).get()
                    );
                    //Make the text re-appear after the very last column is removed...
                    if ($('#' + jqgridGroupColumnHeader + ' ul li:not(.placeholder)').length === 0) {
                        $('<li class="placeholder">Drop header columns here</li>').appendTo($this);
                    }
                }).appendTo(groupingColumn);
                groupingColumn.append(ui.draggable.text());
                groupingColumn.addClass("ui-state-default ui-th-column ui-th-ltr JqgridGroupColumnHeader_DragNDropEffect");
                groupingColumn.appendTo($this);
                jqgridGroupColumnHeader_GroupingRemove();
                jqgridGroupColumnHeader_GroupingGroupBy(
                    $('#' + jqgridGroupColumnHeader + ' ul li:not(.placeholder)').map(function () { return $(this).attr('data-column'); }).get()
                );
            }
        });
        //[Re-arrange columns' position in "Group Columns Header" box]...
        $('#' + jqgridGroupColumnHeader + ' ul').sortable({
            items: 'li:not(.placeholder)',
            sort: function () { $(this).removeClass('ui-state-default'); },
            stop: function () {
                jqgridGroupColumnHeader_GroupingRemove();
                jqgridGroupColumnHeader_GroupingGroupBy(
                    $('#' + jqgridGroupColumnHeader + ' ul li:not(.placeholder)').map(function () { return $(this).attr('data-column'); }).get()
                );
            },
            revert: true//,
            //axis: 'y'
        });
        function jqgridGroupColumnHeader_GroupingRemove() { $('#' + jqgridSpreadsheetId).jqGrid('groupingRemove'); }
        function jqgridGroupColumnHeader_GroupingGroupBy(parmColumnName) {
            $('#' + jqgridSpreadsheetId).jqGrid('groupingGroupBy',
                parmColumnName,
                {
                    groupCollapse: true,
                    groupField: ['name'],
                    groupText: ["<span style='float:left;font-weight:bold;'>{0} ({1})</span><span style='float:right;font-weight:bold;'> </span>"]//,
                }
            );
        }
    });
</script>  
</head>
<body>
    <div id="MyInventoryJqgrid_GroupColumnHeader" class="JqgridGroupColumnHeader"></div>
    <div><table id="MyInventoryJqgrid_Spreadsheet"></table></div>
    <div id="MyInventoryJqgrid_Pager"></div>
</body>
</html>
4

1 に答える 1

2

あなたの問題の理由は、グループ化のためのサーバー コードに対する要件の誤解だと思います。使用しない場合loadonce: true、サーバーはgroupField に基づいてソートされたデータを返す必要があります。この場合に jqGrid が行うことは、値がgroupField同じになるまで行をグループ化することです。前の行のようにフィールドの値が異なる場合、jqGrid は新しいグループ化ヘッダーを挿入します。

groupingGroupByが行うことはそれほど多くありません。グリッドのいくつかのパラメーターの設定、いくつかの列の表示または非表示、およびtrigger("reloadGrid")主な仕事を行う呼び出しです。groupingGroupByメソッドのソース コードはこちらを参照してください。それは十分に小さいです。

そのため、サーバー コードを修正して、正しく並べ替えられたデータを返す必要があります。

于 2013-06-13T20:13:01.313 に答える