ロゴ
HOME > jQuery・Javascript > エクセルのようにセルの結合が出来るスケジューラーを作る

エクセルのようにセルの結合が出来るスケジューラーを作る

2023年12月05日

クリエイター系のクライアント様より、顧客とのスケジュールを管理するツールについてご相談を受けました。これまではエクセルで管理されていたとのことで、スプレッドシート系のオープンソースを先ずはご提案させて頂きました。

Jspreadsheet
https://bossanova.uk/jspreadsheet/v3/

文字入力やカレンダー選択、表計算など本格的なものなのですが、セルの結合が出来ないことがネックとなりました。スケジュールである以上は日を跨いで1項目としたいケースが多々発生します。

 

Googleスプレッドシートの共有もご提案しましたが、何を変更したかなど履歴を保存したいことや権限管理をされたいとのことで、サンプルを作成してみました。

https://studio-key.com/Sample/schedule/

※なお、セル結合部分に関してTable Tag Generator様のソースを参考にさせて頂いております。この場を借りて御礼申し上げます。

セルの編集だけでしたらHTML5のcontentEditableを使えばいいのですが、今後の展開としてマスタ化した値をセレクトボックスで選択させたり、カレンダー展開なども可能性としては有るとのことで、クリック時に挿入するようにしています。

保存はテーブルタグまるごとHTMLをデータベースに入れてしまいまえば再現や比較も簡単です。

 

今は共有ツールが豊富ですので出来ればそれらを使った方がいいとは思いますが、痒いところに手が届くものって中々無いものですね。

ということで、セル結合可能な簡易スケジューラーのご紹介でした!