原文地址：https://gcdn.grapecity.com.cn/forum.php?mod=viewthread&tid=74236&extra=page%3D1
SpreadJS ，作爲一款基於 HTML5 的純前端電子表格控件，兼容 450 種以上的 Excel 公式，可爲用戶帶來親切的 Excel 使用體驗，並可滿足企業IT部門 Web Excel 組件開發、數據填報、Excel 類報表設計、表格文檔協同編輯等業務場景。
在日常使用SpreadJS開發的過程中，我們經常會使用其數據綁定功能，SpreadJS 的數據綁定提供雙向綁定模式。藉助SpreadJS數據綁定，可以很方便的將源數據展示在指定的區域內，以實現數據的獲取與變更。
本文將就“多層表頭數據綁定”的難度與實現方式做以闡述，希望給大家提供參考：
巧用 SpreadJS 給多層表頭綁定數據
衆所周知，由於中美文化的差異，Excel的table功能難以實現多層表頭，大家都是在sheet中繪製多層表格來達到相似的效果。
那麼，在SpreadJS中該如何給這樣的表格模板做數據綁定呢？
由於sheet的工作表區域中（viewport）存在表頭信息，所以不能使用表單綁定。因此，我們只能通過表格綁定來完成，但是表格table無法在Excel中設置多層表頭，所以我們需要藉助 SpreadJS 提供的技巧，對模板進行改造。
-
用 SpreadJS設計器打開這個Excel模板
-
保留表頭，刪除需要綁定數據的相關表格，這裏我們需要通過表格綁定重新建立
- 按照上面表格每一列的內容，對應插入一個空白的table
- 由於最後一行是整體的合計，因此我們需要將彙總行也設置出來
- 利用匯總行設置彙總公式
-
利用模板功能，設置表格綁定，因爲最後兩列爲公式計算結果所以不設置綁定項
-
拖拽右側的樹至表格建立綁定關係（如果需要改變調整每列的綁定關係，可以點擊下圖紅框所示的向下箭頭，在其中進行調整）
- 爲了保證樣式的統一，我們清空表格樣式
- 勾掉標題行：實現隱藏標題行
- 刪除上方的空白行
這樣，一個改造過的表格模板就完成了。
下面，我們開始實現多表頭數據綁定，模擬的數據源見文末附件。
首先，通過代碼將數據源綁定到表格中，data就是附件的數據源：
var source = GC.Spread.Sheets.Bindings.CellBindingSource(data);
sheet.setDataSource(source);
運行結果如下： 
通過代碼給後兩列設置公式，完成最終結果：
總結
以上，就是SpreadJS實現多表頭數據綁定的全部步驟，其實通過SpreadJS 實現數據綁定的方式非常簡單，重點在於對 Excel模板的改造過程。
藉助SpreadJS 的內置形狀、基於單元格級別的數據綁定方式和450 多種公式支持，您可以很輕易的將Excel模板改造成所需的樣式，並“一絲不變”的導入Excel中。
數據源文件：data.json（請將這個 Json文件，通過 SpreadJS 的在線表格編輯器導入，以查看效果）
