w2toolbar.get

get([id], [returnIndex])

idを指定してアイテムまたは、アイテムのインデックスを返します。 戻り値はobject(.itemsプロパティのitem)、integer、nullです。

id: string

取得するアイテムのid。オプションです。

returnIndex: boolean

trueの場合、アイテム配列にインデックスを含めます。オプションです。

説明

第1引数のidは、ツールバー生成時に指定したアイテムのidです。.items配列には全てのツールバーアイテムが格納されています。 アイテムが見つからない場合はnullを返します。

第2引数のreturnIndexは、.items配列のインデックスが必要な場合に指定します。

ツールバーが以下のように定義されている場合、

$('#toolbar').w2toolbar({
    name  : 'toolbar',
    right : 'text on the right',
    items : [
        { type: 'check',  id: 'item1', text: 'Check', img: 'icon-page', checked: true },
        { type: 'radio',  id: 'item3',  group: '1', text: 'Radio 1', img: 'icon-add' },
        { type: 'radio',  id: 'item4',  group: '1', text: 'Radio 2', img: 'icon-add' },
        { type: 'menu',   id: 'item5', text: 'Drop Down',
            items: [
                { id: 'id1', text: 'menu 1' },
                { id: 'id2', text: 'menu 2' },
                { id: 'id3', text: 'menu 3' },
            ]
        }
    ]
});

以下のように指定します。

console.log( w2ui['toolbar'].get('item3') );

メニューのアイテムを取得することもできます。

w2ui['toolbar'].get('item5:id2');

デモ

ボタンをクリックすると、'check2'のitem.textを表示します。

JavaScript

$('#toolbar').w2toolbar({
  name  : 'mytoolbar',
  items : [
    { type: 'check',  id: 'item1', text: 'check1' },
    { type: 'check',  id: 'item2', text: 'check2' },
    { type: 'check',  id: 'item3', text: 'check3' },
  ],
});

$('#get-result').on('click', function(){
  // 返されるオブジェクトは.itemsプロパティのitemと同じ構造です。
  var result = w2ui['mytoolbar'].get('item2');
  document.getElementById('result').innerHTML = result.text;
});

HTML

<button id="get-result">実行</button>
<div>
  <span id="result"></span>
</div>
<div id="toolbar"></div>