RadPHP XEでQListBoxを使う方法。
※RPCLはRevision 291を使用しました。
参考:RPCL(RadPHP Component Library) の最新版について
QListBoxは複数の選択肢から項目を選択するコンポーネントです。
選択できるコンポーネントは、一つか複数かを設定できます。
■選択肢の登録
QListBoxの選択肢は、Itemsプロパティで設定します。
//項目の設定。引数は値の配列。
$this->QListBox1->writeItems(array('RadPHP XE', 'Delphi XE', 'C++Builder XE'));
■複数選択の設定
複数選択ができるようにするには、MultiSelectプロパティを設定します。
//複数選択を可能にする
$this->QListBox1->writeMultiSelect(true);
JavaScriptで設定する時は、setSelectionMode()メソッドに引数’multi’を与えます。
//複数選択を有効にする
QListBox1.setSelectionMode('multi');
■項目の選択
項目を選択するには、JavascriptでsetSelection()メソッドに引数として選択する項目を与えます。
//選択項目を設定する
QListBox1.setSelection([QListBox1.getChildren()[2]]); //3番目の項目を選択する
■選択できない項目
JavaScriptでqx.ui.form.ListItemのsetEnabled()メソッドに引数falseを与えると、その項目は選択できなくなります。
//選択できないようにする
QListBox1.getChildren()[1].setEnabled(false); //2番目の項目を選択できなくする
2番目の項目がグレー表示されて選択できません。
■選択方法の設定
JavaScriptでsetQuickSelection()メソッドに引数trueを与えると、マウスオーバーで選択状態になります。複数選択の時は無効です。
//マウスオーバーで選択状態にする。複数選択の時は無効。
QListBox1.setQuickSelection(true);
マウスカーソルの下にある項目が選択状態になります。
JavaScriptでsetDragSelection()メソッドに引数trueを与えると、マウスでドラッグした範囲の項目が選択状態になります。複数選択の時のみ有効です。
//マウスのドラッグで選択状態にする。複数選択の時のみ有効。
//QListBox1.setDragSelection(true);
マウスでドラッグした範囲の項目が選択状態になります。
■選択項目の取得
フォームがSubmitされても、QListBoxの選択項目は送信されません。
そこで、JavaScriptを使って選択項目をHiddenFieldに設定して送信します。
//ボタンのJavaScriptのOnClickイベント。
//ここでHiddenFieldにQListBoxの選択項目の値を登録します。
function QButton1JSClick($sender, $params)
{
?>
//begin js
//選択された項目の値をJSON形式でHiddenField1に設定する
var values = [];
var selectedItem = QListBox1.getSelection();
for (var i = 0; i < selectedItem.length; i++) {
values[i] = selectedItem[i].getLabel();
}
findObj('HiddenField1').value = toJSON(values);
//end
<?php
}
フォームから送信されたQListBoxをデコードして、PHPの配列の形に変換します。
//送信された値を受け取る。
function QButton1Click($sender, $params)
{
$values = json_decode(html_entity_decode($this->HiddenField1->value));
echo var_dump($values);
}
【送料無料】PHPで初めてドラッグ&ドロップ開発を実現した革新的なWeb開発環境RadPHP XE ESD … |
Pingback: RadPHP XE2に期待するのは、何よりもバグ修正 « 山本隆の開発日誌