2016-09-09 7 views
0

私のデータソースには、1対1に関連する2つのフィールド 'number'と 'name'があります。剣道用のグループヘッダーをカスタマイズする

現在、番号フィールドを使用してデータをグループ化し、グループヘッダーには「番号:xxx」と表示されます。現在のテキストの後ろに名前フィールドを追加する方法はありますか? 'number:xxx、name:xxxx'?

私は剣道グリッドの文書をチェックして、長い時間を探しましたが、剣道グリッドのみのサポートでは、グループ化されたフィールドの値に基づいてグループヘッダーを表示するか、グループ化するソリューションを見つけることができませんでした。

次に、私はそれに対処する別の解決策を持っています。 2つのフィールドを結合した新しいフィールドを追加し、この新しいフィールドでグループ化しますが、新しいフィールドは列ヘッダーの列フィルターに表示されます。この問題を解決する方法はありますか?

$("#grid").kendoGrid({ 
 
    columns: [{ 
 
     field: "number", 
 
     hidden: true 
 
    },{ 
 
     field: "name" 
 
    }, { 
 
     field: "order" 
 
    }], 
 
    dataSource: { 
 
     data: [{ 
 
     \t \t number: 1, 
 
      name: "Jane Doe", 
 
      order: "order1"    
 
     }, 
 
     { 
 
     \t \t number: 1, 
 
      name: "Jane Doe", 
 
      order: "order2"    
 
     }, 
 
     { 
 
     \t \t number: 1, 
 
      name: "Jane Doe", 
 
      order: "order3"    
 
     },{ 
 
     \t \t number: 2, 
 
      name: "Allen", 
 
      order: "order1" 
 
     },{ 
 
     \t \t number: 2, 
 
      name: "Allen", 
 
      order: "order2" 
 
     } 
 
     ], 
 
     group: { 
 
      field: "number"   
 
     } 
 
    } 
 
});

次のコードは、結合フィールドを表示することができますが、二つの問題があります: 1.ヘッダーテキストは、常に「ヘッダー:」を含有するようなヘッダ」などの接頭辞、:数は: 1、名前:Jane Doe "; 2.列フィルターには、ヘッダー列があります。

$("#grid").kendoGrid({ 
 
    columns: [{ 
 
     field: "number", 
 
     hidden: true 
 
    },{ 
 
     field: "name", 
 
     hidden: true 
 
    }, { 
 
     field: "order" 
 
    },{ 
 
     field: "header", 
 
     hidden: true 
 
    } 
 
    ], 
 
    dataSource: { 
 
     data: [{ 
 
     \t \t number: 1, 
 
      name: "Jane Doe", 
 
      order: "order1", 
 
      header: "number: 1, name: Jane Doe" 
 
     }, 
 
     { 
 
     \t \t number: 1, 
 
      name: "Jane Doe", 
 
      order: "order2", 
 
      header: "number: 1, name: Jane Doe" 
 
     }, 
 
     { 
 
     \t \t number: 1, 
 
      name: "Jane Doe", 
 
      order: "order3", 
 
      header: "number: 1, name: Jane Doe" 
 
     },{ 
 
     \t \t number: 2, 
 
      name: "Allen", 
 
      order: "order1", 
 
      header: "number: 2, name: Allen" 
 
     },{ 
 
     \t \t number: 2, 
 
      name: "Allen", 
 
      order: "order2", 
 
      header: "number: 2, name: Allen" 
 
     } 
 
     ], 
 
     group: { 
 
      field: "header"   
 
     } 
 
    }, 
 
    columnMenu: true 
 
});

おかげ

+0

?それは私たちがあなたのために問題を解決するのを助けるでしょう。ただの説明ではあまりできないことがあります。 – Cerbrus

+0

@Cerbrus、返信いただきありがとうございます、投稿の私のコードをご覧ください。番号でグループ化されたデータ、グループ内のすべての名前が同じなので、名前フィールドを非表示にして、グループヘッダーに表示させます。 "number:1、name:Jane Doe"などのように。 – Allen4Tech

答えて

0

は、あなたがgroupHeaderTemplateを使用する必要があり、グループヘッダからの列の記述を非表示にするには: "#= data.value#"。

ColMenuから列を非表示にするには、列定義で「menu」:falseを使用する必要があります。

適用両方の変更wiht列には、次のようになります。あなたはスニペットでこのシナリオを再現できる

{ 
     field: "header", 
     hidden: true, 
     "menu": false, 
     groupHeaderTemplate: "#= data.value #", 
    } 
+0

すべてのレコードに対してデータソース全体をループする必要があるように見えますが、パフォーマンスの問題が発生する可能性があります。他の方法はありますか?私のポストでは、私は解決策を書いてもうまくいきませんが、導入されたヘッダー列を列フィルターに隠して、 "ヘッダー:"プレフィックスを私のコードに隠すことはありませんか? – Allen4Tech

+0

use groupHeaderTemplate: "#= data.value#" – calinaadi

+0

これは2番目の問題を解決しましたが、最初の問題を修正する方法はありますか?結合フィールドは、列のフィルタに表示されます、それを隠す方法はありますか? – Allen4Tech

関連する問題