← TssGrid/例一覧

TssGrid 例: Excel(xlsx)読込 サンプル + ExcelJS

xlsx の読込ExcelJS(MIT)がパースを全部やってくれるので、CSV と違い自前パース不要。データ(セルの値)だけ取り込みます(書式・数式は無視=数式はその結果値を採用)。1行目を見出し、2行目以降をデータとして setData でグリッドに反映。
下の「サンプル生成して読込」で round-trip(生成→読込)を確認、または実ファイルを選択して取り込めます。出力は excel-export.html で。

差し込み(要点)

// セル値→テキスト(データのみ。数式は結果値、日付は yyyy-mm-dd)
function cellText(v){
  if (v == null) return '';
  if (v instanceof Date) return v.toISOString().slice(0,10);
  if (typeof v === 'object') {
    if (Array.isArray(v.richText)) return v.richText.map(t=>t.text).join('');
    if ('result' in v) return cellText(v.result);     // 数式 {formula,result}
    if ('text' in v)   return String(v.text);          // ハイパーリンク
    return '';
  }
  return String(v);
}
const wb = new ExcelJS.Workbook();
await wb.xlsx.load(await file.arrayBuffer());          // ← ExcelJS がパース
const ws = wb.worksheets[0], rows = [];
ws.eachRow({ includeEmpty:false }, (row) => {
  const a = []; for (let c=1;c<=ws.columnCount;c++) a.push(cellText(row.getCell(c).value));
  rows.push(a);
});
const headers = rows.shift();                          // 1行目=見出し
new TssGrid(host, { headers, data: rows });            // ← グリッドに反映