SpreadJSは 、HTML5に基づく純粋なフロントエンドスプレッドシートコントロールであり、450を超えるExcel数式と互換性があります。ユーザーに使いやすいExcelエクスペリエンスを提供し、エンタープライズIT部門のWeb Excelコンポーネント開発、データレポート、Excelレポートのニーズを満たすことができます。フォームやドキュメントのデザインや共同編集などのビジネスシナリオ。
SpreadJSを使用した日常の開発プロセスでは、データバインディング機能を使用することが多く、SpreadJSデータバインディングは双方向バインディングモードを提供します。SpreadJSデータバインディングを使用すると、ソースデータを指定した領域に簡単に表示して、データの取得と変更を行うことができます。
この記事では、「マルチレイヤーヘッダーデータバインディング」の難しさと実装について説明します。リファレンスを提供したいと思います。
SpreadJSを使用してデータをマルチレイヤーヘッダーにバインドする
ご存知のように、中国とアメリカの文化の違いにより、Excelのテーブル関数はマルチレイヤーヘッダーを実現することが困難です。シートにマルチレイヤーテーブルを描画すると、同様の効果が得られます。
では、SpreadJSでこのようなフォームテンプレートにデータバインディングを行う方法を教えてください。
ヘッダー情報はシートのビューポートに存在するため、フォームバインディングは使用できません。したがって、テーブルバインディングを通じてのみ実行できますが、テーブルテーブルはExcelのマルチレイヤーヘッダーで設定できないため、SpreadJSが提供するスキルを使用してテンプレートを変更する必要があります。
1.このExcelテンプレートをSpreadJSデザイナーで開きます。
2.ヘッダーを保持し、データをバインドする必要のある関連テーブルを削除します。ここでは、テーブルバインドを通じてヘッダーを再確立する必要があります。
3.上記の表の各列の内容に応じて、空白の表を適宜挿入します。
4.最後の行は全体の合計なので、集計行も設定する必要があります。
5.集計行を使用して、集計式を設定します。
6.テンプレート関数を使用してテーブルバインディングを設定します。これは、最後の2つの列が数式の計算結果であり、バインディングアイテムが設定されていないためです。
7.右側のツリーをテーブルにドラッグしてバインド関係を確立します（各列のバインド関係を変更および調整する必要がある場合は、下の図の赤いボックスに表示されている下矢印をクリックして調整できます）。
8.スタイルの統一を確実にするために、テーブルスタイルをクリアします。
9.タイトル行にチェックマークを付けます：タイトル行を非表示にします。
10.上記の空白行を削除します
このようにして、変更されたフォームテンプレートが完成します。次に、マルチヘッダーデータバインディングの実装を開始します。最初に、コードを通じてデータソースをテーブルにバインドします。データは添付ファイルのデータソースです。
var source = GC.Spread.Sheets.Bindings.CellBindingSource（data）;
sheet.setDataSource（ソース）;
結果は次のとおりです。
コードを使用して最後の2つの列の数式を設定し、最終結果を完成させます。
総括する
上記は、SpreadJSがマルチヘッダーデータバインディングを実現するためのすべての手順ですが、実際には、SpreadJSを介してデータバインディングを実現する方法は非常に簡単で、Excelテンプレートの変換プロセスに重点が置かれています。
SpreadJSの組み込みの図形、セルレベルのデータバインディング、および450以上の数式サポートの助けを借りて、Excelテンプレートを目的のスタイルに簡単に変換し、それをExcelに「同じもの」にインポートできます。
純粋なフロントエンドテーブルコントロールSpreadJSは、.NET、Java、AppなどのアプリケーションでのWeb Excelコンポーネント開発、データ入力、オンラインドキュメント、グラフ数式リンク、Excel UIデザインなどのビジネスシナリオに対応し、データの視覚化とExcelでのインポートとエクスポートを行うことができます。 、数式参照、データバインディング、およびフレームワークの統合には、多くのコード開発とテストが必要ないため、企業のR＆Dコストとプロジェクトの提供リスクを大幅に削減できます。
この記事はから再生されたブドウ市