こんにちは。beaglesoftの真鍋です。
このところDHTMLXに関するエントリーを続けています。とても素晴らしいライブラリなのですが、はまりどころもあるため少しでもお役に立てればと思ってはまったところをまとめています。
今回はレイアウトが正しく表示されない事象について遭遇したことをまとめました。おそらく今回のようなレイアウトがアコーディオンになるケースは設定の見落としが原因なのではと推測しています。
事象について
dhtmlXTabでタブ内のレイアウト表示などが正しく表示されないことがあります。たとえば、セルにdhtmlXLayoutを設定しているときにセルがアコーディオン状態になったりすることあります。
この画面は本当はこのように表示したいと考えていました。
対応方法
たいていの場合、このような想定している挙動と異なる場合には何か設定が間違えていることが多いです。今回の場合では、表示対象のタブがアクティブな状態となっていないことが原因でした。
var tabConfig = {
align: "left",
mode: "top",
tabs: [
{id: "kanjo_kamoku_config", text: "勘定科目設定", active: true}, // <= ここでactive:trueを指定する
{id: "hojo_kamoku_config", text: "補助科目設定"},
{id: "keihi_himoku_config", text: "経費費目設定"},
{id: "shiharai_himoku_config", text: "支払費目設定"},
{id: "keiri_config", text: "経理設定"},
{id: "user_admin", text: "ユーザー管理"},
{id: "user_company_config", text: "会社設定"},
]
};
dhtmlXTabBarでは、同様の設定がsetActiveメソッドでも可能なのでそちらを使用するでも良いと思います。
