グリッド内のコンボボックス

グリッド内にコンボボックスを入れた例。両者別々のデータセットを参照しています。コンボボックスで選んだ値を、同じ行の別のセルに自動入力しています。

サンプルアプリのアプリとしての良し悪しは別として(笑)。。

ただ、グリッド<grid>もコンボボックス<combobox>もOpenLaszlo標準コンポーネントではトップ３に入る(？)ぐらい重いので、あんまりデータ量が増えるとパフォーマンス的にとんでもないことになる気がします。そのへんご注意。

ソートしたときにコンボボックスがついていかないので、ソート可能のままにしたいならまだ調整必要。

(OpenLaszlo4.7.1/swf8)

<canvas proxied="false" bgcolor="0xeeeeee">
  <dataset name="ds1" >
    <root>
      <data name="織田信長" st=""/>
      <data name="豊臣秀吉" st=""/>
      <data name="徳川家康" st=""/>
      <data name="前田利家" st=""/>
      <data name="伊達政宗" st=""/>
    </root>
  </dataset>
  <dataset name="ds2" >
    <root>
      <data st="出社"/>
      <data st="休暇"/>
      <data st="出張"/>
    </root>
  </dataset>
  <grid datapath="ds1:/root"  shownitems="5">
    <gridcolumn text="選択" >
      <combobox datapath="." editable="false" >
        <textlistitem datapath="ds2:/root/data" text="$path{'@st'}" value="$path{'@st'}" />
        <handler name="onselect">
          this.datapath.setNodeAttribute("st", this.value);
        </handler>
      </combobox>
    </gridcolumn>
    <gridcolumn  text="氏名" >
      <text datapath="@name"/>
    </gridcolumn>
    <gridcolumn  text="勤務状況" >
      <text datapath="@st"/>
    </gridcolumn>
  </grid> 
</canvas>

Special thanx to Andre Bargull(OpenLaszlo User ML)

別セルの値でコンボボックスを自動選択する例。ボタンを押すとコンボボックスの値が設定されます。もちろんコンボボックスで選択すると、セルの値も変わります。

これもソートしたときにコンボボックスがついていかないので注意。

(OpenLaszlo4.7.1/swf8)

<canvas proxied="false" bgcolor="0xeeeeee" >
  <dataset name="ds1">
    <root>
      <data name="データ１" st="区分１"/>
      <data name="データ２" st="区分２"/>
      <data name="データ３" st="区分３"/>
      <data name="データ４" st="区分２"/>
      <data name="データ５" st="区分１"/>
    </root>
  </dataset>
  <dataset name="ds2" >
    <root>
      <data st="区分１"/>
      <data st="区分２"/>
      <data st="区分３"/>
    </root>
  </dataset>
  <grid id="grid1" datapath="ds1:/root" shownitems="5">
    <attribute name="btnclicked" type="boolean" value="false"/>
    <gridcolumn name="gc" text="選択" >
      <combobox name="cb" datapath="." editable="false">
        <handler name="onbtnclicked" reference="grid1">
          this.selectItem(this.datapath.xpathQuery("@st"));
        </handler>
        <textlistitem datapath="ds2:/root/data" text="$path{'@st'}" value="$path{'@st'}" />
        <handler name="onselect">
          this.datapath.setNodeAttribute("st", this.value);
        </handler>
      </combobox>
    </gridcolumn>
    <gridcolumn text="氏名" >
      <text datapath="@name"/>
    </gridcolumn>
    <gridcolumn text="区分" >
      <text datapath="@st" />
    </gridcolumn>
  </grid>
  <button  y="150">コンボボックスを区分と同じ設定に
    <handler name="onclick">
      grid1.setAttribute('btnclicked',"true");
    </handler>
  </button>
</canvas>