-1

関連する質問を見てきました この質問

私の仕事に適用しようとしました。「読み込み中...」と書かれた吹き出しがぶら下がっているグリッドのヘッダーが表示されますが、何も起こりません。コンソールを実行すると、次のようなエラーが表示されます。

 SCRIPT5007: Unable to get value of the property 'stype': object is null or undefined 
 jquery.jqGrid.min.js, line 72 character 461

このような：スクリーンショット

1) Oleg によって提示されたソリューションは、すぐに使用できます。それは彼のjsonと彼のjavascriptです。ありがとう。
2) Oleg で使用されているものに似た Json データがあります。ここにあります

{
 "results":[
  {
     "analysisStatus":null,
     "label":"SPR - Test Only - Cost Analyzer 1-GUI Prototype",
     "leaf":false,
     "level":0,
     "lockedBy":"",
     "overrideCostingMRC":955.2800,
     "overrideCostingNRC":3739.7900,
     "overrideCostingUsage":151.7300,
     "overridePricingMRC":1531.4800,
     "overridePricingNRC":2580.0000,
     "overridePricingUsage":210.4800,
     "parent":"",
     "proposedCostingMRC":955.2800,
     "proposedCostingNRC":3739.7900,
     "proposedCostingUsage":151.7300,
     "proposedPricingMRC":1531.4800,
     "proposedPricingNRC":2580.0000,
     "proposedPricingUsage":210.4800,
     "rowId":36624,
     "standardCostingMRC":955.2800,
     "standardCostingNRC":3739.7900,
     "standardCostingUsage":151.7300,
     "standardPricingMRC":1531.4800,
     "standardPricingNRC":2580.0000,
     "standardPricingUsage":210.4800
  },
  {
     "label":"Broadspeed DIA 3.0: 1.5 Mb\/s",
     "leaf":false,
     "level":1,
     "overrideCostingMRC":299.9400,
     "overrideCostingNRC":118.4400,
     "overrideCostingUsage":0.0000,
     "overridePricingMRC":444.0000,
     "overridePricingNRC":800.0000,
     "overridePricingUsage":0.0000,
     "parent":36624,
     "proposedCostingMRC":299.9400,
     "proposedCostingNRC":118.4400,
     "proposedCostingUsage":0.0000,
     "proposedPricingMRC":444.0000,
     "proposedPricingNRC":800.0000,
     "proposedPricingUsage":0.0000,
     "rowId":54130,
     "standardCostingMRC":299.9400,
     "standardCostingNRC":118.4400,
     "standardCostingUsage":0.0000,
     "standardPricingMRC":444.0000,
     "standardPricingNRC":800.0000,
     "standardPricingUsage":0.0000
   },
   {
     "label":"Broadview PRI: Measured GR",
     "leaf":false,
     "level":1,
     "overrideCostingMRC":298.1700,
     "overrideCostingNRC":208.0000,
     "overrideCostingUsage":115.7600,
     "overridePricingMRC":409.6800,
     "overridePricingNRC":800.0000,
     "overridePricingUsage":210.4800,
     "parent":36624,
     "proposedCostingMRC":298.1700,
     "proposedCostingNRC":208.0000,
     "proposedCostingUsage":115.7600,
     "proposedPricingMRC":409.6800,
     "proposedPricingNRC":800.0000,
     "proposedPricingUsage":210.4800,
     "rowId":54131,
     "standardCostingMRC":298.1700,
     "standardCostingNRC":208.0000,
     "standardCostingUsage":115.7600,
     "standardPricingMRC":409.6800,
     "standardPricingNRC":800.0000,
     "standardPricingUsage":210.4800
   },
   {
     "label":"Wild Card - Customer",
     "leaf":true,
     "level":2,
     "overrideCostingMRC":0.0000,
     "overrideCostingNRC":0.0000,
     "overrideCostingUsage":0.0000,
     "overridePricingMRC":234.0000,
     "overridePricingNRC":0.0000,
     "overridePricingUsage":0.0000,
     "parent":54130,
     "proposedCostingMRC":0.0000,
     "proposedCostingNRC":0.0000,
     "proposedCostingUsage":0.0000,
     "proposedPricingMRC":0.0000,
     "proposedPricingNRC":0.0000,
     "proposedPricingUsage":0.0000,
     "rowId":388316,
     "standardCostingMRC":0.0000,
     "standardCostingNRC":0.0000,
     "standardCostingUsage":0.0000,
     "standardPricingMRC":0.0000,
     "standardPricingNRC":0.0000,
     "standardPricingUsage":0.0000
  },
  {
     "label":"Wild Card - Customer",
     "leaf":true,
     "level":2,
     "overrideCostingMRC":0.0000,
     "overrideCostingNRC":0.0000,
     "overrideCostingUsage":0.0000,
     "overridePricingMRC":40.0000,
     "overridePricingNRC":0.0000,
     "overridePricingUsage":0.0000,
     "parent":54130,
     "proposedCostingMRC":0.0000,
     "proposedCostingNRC":0.0000,
     "proposedCostingUsage":0.0000,
     "proposedPricingMRC":0.0000,
     "proposedPricingNRC":0.0000,
     "proposedPricingUsage":0.0000,
     "rowId":404097,
     "standardCostingMRC":0.0000,
     "standardCostingNRC":0.0000,
     "standardCostingUsage":0.0000,
     "standardPricingMRC":0.0000,
     "standardPricingNRC":0.0000,
     "standardPricingUsage":0.0000
  },
  {
     "label":"Wild Card - Customer",
     "leaf":true,
     "level":2,
     "overrideCostingMRC":0.0000,
     "overrideCostingNRC":0.0000,
     "overrideCostingUsage":0.0000,
     "overridePricingMRC":0.0000,
     "overridePricingNRC":0.0000,
     "overridePricingUsage":0.0000,
     "parent":54131,
     "proposedCostingMRC":0.0000,
     "proposedCostingNRC":0.0000,
     "proposedCostingUsage":0.0000,
     "proposedPricingMRC":0.0000,
     "proposedPricingNRC":0.0000,
     "proposedPricingUsage":0.0000,
     "rowId":404098,
     "standardCostingMRC":0.0000,
     "standardCostingNRC":20.0000,
     "standardCostingUsage":0.0000,
     "standardPricingMRC":0.0000,
     "standardPricingNRC":0.0000,
     "standardPricingUsage":0.0000
  },
  {
     "label":"Wild Card - Customer",
     "leaf":true,
     "level":2,
     "overrideCostingMRC":0.0000,
     "overrideCostingNRC":0.0000,
     "overrideCostingUsage":0.0000,
     "overridePricingMRC":3.25,
     "overridePricingNRC":0.0000,
     "overridePricingUsage":0.0000,
     "parent":54131,
     "proposedCostingMRC":0.0000,
     "proposedCostingNRC":0.0000,
     "proposedCostingUsage":0.0000,
     "proposedPricingMRC":0.3000,
     "proposedPricingNRC":0.0000,
     "proposedPricingUsage":0.0000,
     "rowId":404099,
     "standardCostingMRC":0.0000,
     "standardCostingNRC":0.0000,
     "standardCostingUsage":0.0000,
     "standardPricingMRC":0.0000,
     "standardPricingNRC":0.0000,
     "standardPricingUsage":0.0000
  }

] }

定義されたグリッドを使用した私の JavaScript コードは次のようになります。

    <script type="text/javascript">
    $(document).ready(function (){
        $.getJSON('sources/cost-analyzer2.json', function(data){
            console.log(data.results);
            var this_grid;
            this_grid = $this_app.define_grid("#grid-results", {
                caption: 'Proposals',
                pager: '#pager-results',
                data: $.extend(true, [], data.results),                 
                datatype: "local",
                height: 'auto',

                rowNumbers: true,               
colNames:['Id', 'Description','Price MRC', 'Cost MRC','Price NRC', 'Cost NRC',  
                    'Price Usage', 'Cost Usage',
'Price MRC', 'Cost MRC','Price NRC', 'Cost NRC', 'Price Usage', 'Cost Usage',
'Price MRC', 'Cost MRC','Price NRC', 'Cost NRC', 'Price Usage', 'Cost Usage'
],
colModel: [                     
    { name: 'rowId', index: 'rowId',  width: 20, hidden:true},      
    { name: 'label', index: 'abel', width: 100},
    { name: 'standardPricingMRC', index: 'standardPricingMRC', width: 70},
    { name: 'standardCostingMRC', index: 'standardCostingMRC', width: 70},
    { name: 'standardPricingNRC', index: 'standardPricingNRC', width: 70},
    { name: 'standardCostingNRC', index: 'standardCostingNRC', width: 70},
    { name: 'standardPricingUsage', index: 'standardPricingMRC', width: 70},
    { name: 'standardCostingUsage', index: 'standardCostingMRC', width: 70},
    { name: 'proposedPricingMRC', index: 'proposedPricingMRC', width: 70},
    { name: 'proposedCostingMRC', index: 'proposedCostingMRC', width: 70},
    { name: 'proposedPricingNRC', index: 'proposedPricingNRC', width: 70},
    { name: 'proposedCostingNRC', index: 'proposedCostingNRC', width: 70},
    { name: 'proposedPricingUsage', index: 'proposedPricingMRC', width: 70},
    { name: 'proposedCostingUsage', index: 'proposedCostingMRC', width: 70},
    { name: 'overridePricingMRC', index: 'overridePricingMRC', width: 70},
    { name: 'overrideCostingMRC', index: 'overrideCostingMRC', width: 70},
    { name: 'overridePricingNRC', index: 'overridePricingNRC', width: 70},
    { name: 'overrideCostingNRC', index: 'overrideCostingNRC', width: 70},
    { name: 'overridePricingUsage', index: 'overridePricingMRC', width: 70},
    { name: 'overrideCostingUsage', index: 'overrideCostingMRC', width: 70} 
            ],
                localReader: {
                    repeatitems: false,                     
                    root: "data.results"                    
                },// end of localReader
                treeGrid: true,
                treeGridModel: 'adjacency',
                treedatatype: "local",
                ExpandColumn: 'label',
                inline_editing: false
            });// end of define_grid -->    

            $("#grid-results").jqGrid('gridResize');
            $("#grid-results").jqGrid('setGroupHeaders', {
    useColSpanStyle: false, 
    groupHeaders:[
{startColumnName: 'standardPricingMRC', numberOfColumns: 6, titleText: 'Standard'},
{startColumnName: 'proposedPricingMRC', numberOfColumns: 6, titleText: 'Proposed'},
{startColumnName: 'overridePricingMRC', numberOfColumns: 6, titleText: 'Override'}
                  ] 
                });

            $("#grid-results").jqGrid('setGroupHeaders', {
                  useColSpanStyle: true, 
                  groupHeaders:[
{startColumnName: 'standardPricingMRC', numberOfColumns: 2, titleText: 'MRC'},
{startColumnName: 'standardPricingNRC', numberOfColumns: 2, titleText: 'NRC'},
{startColumnName: 'standardPricingUsage', numberOfColumns: 2, titleText: 'Usage'},
{startColumnName: 'proposedPricingMRC', numberOfColumns: 2, titleText: 'MRC'},
{startColumnName: 'proposedPricingNRC', numberOfColumns: 2, titleText: 'NRC'},
{startColumnName: 'proposedPricingUsage', numberOfColumns: 2, titleText: 'Usage'},
{startColumnName: 'overridePricingMRC', numberOfColumns: 2, titleText: 'MRC'},
{startColumnName: 'overridePricingNRC', numberOfColumns: 2, titleText: 'NRC'},
{startColumnName: 'overridePricingUsage', numberOfColumns: 2, titleText: 'Usage'}
                  ] 
                });


        }); <!-- end of getJSon() -->
    });<!-- end of ready() -->    
</script>

次の行を削除すると、データがグリッドで表示されますが、ツリーは表示されません。

    treeGrid: true,
treeGridModel: 'adjacency',
treedatatype: "local",
ExpandColumn: 'label',

誰でも助けることができますか？私は何を間違っていますか？

ありがとう

4

2 に答える 2

1

デモを確認してください。問題は、最後の 4 つのレコードの親 ID が、3 つのノードではなく最初のノードを指していたことです。idそして、フィールドが指すことができるようにフィールドを追加する必要がありますparent。構成する必要があるオブジェクト階層は次のとおりです。

レベル 1 の 2 番目のアイテムの下に 2 つのアイテムが表示される理由は、2 番目のアイテムの後にデータを配置したためです。レベル 1 の 2 番目のアイテムの前に移動するだけです。

[
   {
      "leaf":false,
      "level":0,
      "parent":"",
      "rowId":36624,
      id:36624,
      expanded:true,
      loaded:true
   },
   {
      "leaf":false,
      "level":1,
      "parent":36624,
      "rowId":54130,
      id:54130,
      isLeaf:false
   },
   {
      "leaf":true,
      "level":2,
      "parent":54131,
      "rowId":388316,
      id:388316,
      isLeaf:true,
      expanded:false
   },
   {
      "leaf":true,
      "level":2,
      "parent":54131,
      "rowId":404097,
      id:404097,
      isLeaf:true
   },
   {                    
      "leaf":false,        ---> This obj goes after the 2 before.
      "level":1,
      "parent":36624,
      "rowId":54131,
      id:54131,
      isLeaf:false
   },
   {
      "leaf":true,
      "level":2,
      "parent":54131,
      "rowId":404098,
      id:404098,
      isLeaf:true
   },
   {
      "leaf":true,
      "level":2,
      "parent":54131,
      "rowId":404099,
      id:404099,
      isLeaf:true
   }
]

それが役に立てば幸い。

Demo

于 2013-08-06T05:19:23.780 に答える
0

この問題は解決しました。どうやら、id列が実際に「id」と呼ばれ、データがどのように駆動されないかが必要です。名前を正しく取得するには、バックエンドを変更する必要がありました。また、 Java (バックエンド) が一般的にブール値のゲッターを作成する方法( isLeaf()のみ) ではなく、json データにマップする dataobject にメソッドgetIsLeafを持たせる必要がありました。唯一の問題は、木が少し曲がっているように見えることです。2 つの行があり、最初の行を展開すると、展開されたサブツリーがグリッドの最後の要素の下に表示されます。 ここに画像の説明を入力

更新された JavaScript コードはこちらです。

    <script type="text/javascript">
    $(document).ready(function (){
        var mydata ;
        $.getJSON('sources/cost-analyzer2.json', function(data){
            mydata=$.extend(true, [], data.results) ;           
            console.log(mydata);

            $("#grid-results").jqGrid({
                datatype: "local",
                data: mydata, // will not used at the loading,
             // but during expanding/collapsing the nodes
 colNames:['Id', 'Description','Price MRC', 'Cost MRC','Price NRC', 'Cost NRC', 
        'Price Usage', 'Cost Usage',
    'Price MRC', 'Cost MRC','Price NRC', 'Cost NRC', 'Price Usage', 'Cost Usage',
        'Price MRC', 'Cost MRC','Price NRC', 'Cost NRC', 'Price Usage', 'Cost Usage'
 ],
colModel: [                     
    { name: 'id', index: 'id',  width: 20, hidden:true},        
    { name: 'label', index: 'label', width: 100},
    { name: 'standardPricingMRC', index: 'standardPricingMRC', width: 70},
    { name: 'standardCostingMRC', index: 'standardCostingMRC', width: 70},
    { name: 'standardPricingNRC', index: 'standardPricingNRC', width: 70},
    { name: 'standardCostingNRC', index: 'standardCostingNRC', width: 70},
    { name: 'standardPricingUsage', index: 'standardPricingMRC', width: 70},
    { name: 'standardCostingUsage', index: 'standardCostingMRC', width: 70},
    { name: 'proposedPricingMRC', index: 'proposedPricingMRC', width: 70},
    { name: 'proposedCostingMRC', index: 'proposedCostingMRC', width: 70},
    { name: 'proposedPricingNRC', index: 'proposedPricingNRC', width: 70},
    { name: 'proposedCostingNRC', index: 'proposedCostingNRC', width: 70},
    { name: 'proposedPricingUsage', index: 'proposedPricingMRC', width: 70},
    { name: 'proposedCostingUsage', index: 'proposedCostingMRC', width: 70},
    { name: 'overridePricingMRC', index: 'overridePricingMRC', width: 70},
    { name: 'overrideCostingMRC', index: 'overrideCostingMRC', width: 70},
    { name: 'overridePricingNRC', index: 'overridePricingNRC', width: 70},
    { name: 'overrideCostingNRC', index: 'overrideCostingNRC', width: 70},
    { name: 'overridePricingUsage', index: 'overridePricingMRC', width: 70},
    { name: 'overrideCostingUsage', index: 'overrideCostingMRC', width: 70} 
            ],
                height:'auto',
                //pager : "#ptreegrid",
                sortname: 'id',
                treeGrid: true,
                treeGridModel: 'adjacency',
                treedatatype: "local",
                ExpandColumn: 'label',
                caption: "Sample Tree View Model"
            });

            $("#grid-results")[0].addJSONData({
                total: 1,
                page: 1,
                records: mydata.length,
                rows: mydata
            });
            $("#grid-results").jqGrid('gridResize');

        });
        });
</script>

なぜそうなのか、何か考えはありますか？また、イベントが Jqgrid - ツリーに実装されているかどうかを知っている人はいますか?

于 2013-08-05T17:08:12.940 に答える