トップ » 逆引きGoogle Apps Script »

[GAS][Ui]リストボックスを実装するには: 逆引きGoogle Apps Script

2012 年 6 月 8 日 金曜日

リストボックス

▼サンプルスクリプト

GoogleサイトのAppsスクリプトガジェットとして動作するサンプルスクリプト。スプレッドシートの都道府県名リストを読み込み、リストボックスに表示している。OKボタンをクリックすると、選択しているアイテムの項目値を画面に表示する。

//リストボックス表示
function doGet() {
  var app = UiApp.createApplication();
  var wrapper = app.createVerticalPanel(); 
 
  //スプレッドシートから取得した都道府県レコードをリストボックスに追加
  var ss  = SpreadsheetApp.openById('xxxxxxxxxx');
  var sheet = ss.getSheetByName('シート1');
  var records = sheet.getRange(1, 1, sheet.getLastRow(), 2).getValues();   
  var list = app.createListBox().setName('prefecture');
 
  for(var i=1; i



行2:doGet()はHTTP GETでスクリプトが呼び出された際に実行されるメソッド。今回の場合は、上記のコードをAppsスクリプトガジェットしてサイトに挿入しているので、Appsスクリプトガジェットが読み込まれる時＝Appsスクリプトガジェットを貼り付けたページが表示される時に呼び出される。


行3:レイアウトパネル(ラッパー)を生成


行7-8:あらかじめ作成した都道府県名スプレッドシートオブジェクトおよびシートオブジェクトを取得している。今回作成したスプレッドシートは以下の通り。A列に都道府県コード、B列に都道府県名を記述している。





行9:あらかじめレコードを全件取得している。



行10:app.createListBoxでリストボックスオブジェクトを作成している。setName()で作成したリストボックスの名称をセットしているが、この名称はのちほど選択値を取得する際に利用する。


行11-13:行9で取得したレコードを上からループしながら、{リストボックスオブジェクト}.addItem()により、リストボックスに項目を追加している。


行17:ボタンクリック時のサーバハンドラを定義。createServerHandler()のパラメータにはバインドするメソッド名、addCallbackElementのパラメータにはバインドするメソッドに受け渡すオブジェクトをセットする。


行18:ボタンを作成。createButtonの第二パラメータにはボタンクリック時のハンドラを指定することができるので、行17で定義したハンドラを指定している。これにより、ボタンクリック時に、ハンドラとバインドしたメソッドが実行されるようになる。


行29:OKボタンクリック時に選択されているリストの値をラベルとしてUiに挿入している。onOkClick_の引数eには以下の配列が格納されている。


Array (
    [parameter] => Array (
        [clientY] => '41'
        [clientX] => '19'
        [eventType] => 'click'
        [ctrl] => 'false'
        [meta] => 'false'
         => 'u194899'
        [prefecture] => 'akita'
        [button] => '1'
        [alt] => 'false'
        [screenY] => '444'
        [screenX] => '480'
        [y] => '15'
        [shift] => 'false'
        [x] => '15' )
)




リストボックス「prefecture」の値を参照するので、e.parameter.prefectureで選択されている項目値を取得することができる。


構文


リストボックスオブジェクトの作成


createListBox()


createListBox(isMultipleSelect)




{Boolean}isMultipleSelect


trueを指定した場合、複数選択可能なリストボックス<select multple>を生成する。




リストボックスへの項目追加


{ListBox}.addItem(text)


{ListBox}.addItem(text, value)




{String}text


項目の表示名


{String}value


項目の値。指定しない場合、textと同じ値がセットされる。




戻り値




List Box


生成したリストボックスオブジェクト




  
逆引きGoogle Apps Scriptリファレンス 目次へ
               
UIサービス関連

     
            










関連記事





[GAS][Ui]ラベルを挿入するには 


[GAS][カレンダー]新しいカレンダーを作成するには 


【Google App Engine】30秒以上の処理を非同期通信で実現する方法 


【Google Apps Script】楽天商品検索APIでアフィリエイトサイト簡単作成ツールを作ってみる 


[GAS]メッセージダイアログを表示するには 



        

        

           このページに不足している情報、ご質問などはコメント欄からお願いします。
        

            
        

				

					
						この投稿は  2012 年 6 月 8 日 金曜日 11:31 PM に Google Apps Script カテゴリーに公開されました。											
				

            
	    


        
        	          
	              
        

        
コメントをどうぞ

         
		            
        

                    
			      

            

		

    


    
    

 

    		

            
トラックバック

        
このエントリーのトラックバックURL:

	
http://www.bmoo.net/archives/2012/06/314057.html/trackback