0

ユーザーがスプレッドシートの各アジェンダ アイテムのアクションを選択できるようにする UI を作成しようとしています。ユーザーがアクションを選択した後、選択内容でスプレッドシートを更新したいと思います。スプレッドシートのデータは静的ではないため、UI は動的に記述されています。

これは私がリストボックスを作成した方法です:

// add labels and a drop down box of actions for each agenda item mark for today
for (i = 0; i < labels.length; i++) {
// labels is an array of objects
var topic = labels[i]['topic'];

// add label to grid
myGrid.setWidget(i, 0, myApp.createLabel(topic));

// the id of each listbox is the content of its corresponding label
var id = ObjApp.camelString(topic)
var lboxActions = myApp.createListBox().setId(id);

//add items to listbox
lboxActions.addItem('Select');
lboxActions.addItem('Add to agenda');
lboxActions.addItem('Move to another meeting');
lboxActions.addItem('Move to a special meetin');
lboxActions.addItem('Move to email');

//add drop down list to grid
myGrid.setWidget(i, 1, lboxActions);

}

3 つの質問があります。

1) より良いデザインはどれですか?

a)デザイン 1 : 各リストボックスの横に保存ボタン。

b)デザイン 2 : 下部に 1 つの送信ボタンがあり、すべてのエントリを保存できます

2) ユーザーの選択に関する情報をどのように収集しますか? そのようなハンドラーをどのように作成しますか? 各デザインに次のコードを追加しましたが、正しく行っているとは思いません。

a)設計 1 : 上記の for ループに次のコード行が追加されました。

var buttonSave = myApp.createButton('Save');
myGrid.setWidget(i, 2, buttonSave);

var handlerSelection = myApp.createServerHandler('selectAction');
handlerSelection.addCallbackElement(mainPanel);
buttonSave.addClickHandler(handlerSelection);

b)設計 2 : 次のコード行が for ループの外側に追加されました

//update spreadsheet when user click "submit"
var handlerUpdate = myApp.createServerHandler('responseToSubmit');
handlerUpdate.addCallbackElement(mainPanel);
buttonSubmit.addClickHandler(handlerUpdate);

mainPanel.add(myGrid);
mainPanel.add(buttonSubmit);
myApp.add(mainPanel);

3) ハンドラー用の関数を作成するにはどうすればよいですか? リスト ボックスから情報を抽出できなかったため、これらは正しくありません。

a)デザイン 1

function responseToSave(e) {

   var name = e.parameter.source;
   var selection = e.parameter.name;

   var selectionObj = new Object();

   selectionObj['status'] = selection;
   selectionObj['name'] = name;

   choicesMade.push(selectionObj)

   Logger.log(choicesMade);
   return choicesMade;
}

b)デザイン 2

function responseToSubmit(e) {
  var myApp = UiApp.getActiveApplication();

  for (i=0; i < labels.length; i++) {
     var lboxId = ObjApp.camelString(labels[i]['topic']);

     //[EDIT] e.parameter.lboxId would not work because lboxId is a string 
     var selection = e.parameter[lboxId];

     choicesMade[labels[i]] = selection;
     }

  Logger.log(choicesMade);
  return choicesMade;
}

ありがとう

4

1 に答える 1

0

Q1: 設計は、アプリケーションの目的とユーザーの使用方法に完全に依存します。「より良い」設計はありません。それぞれに長所と短所があり、選択はアプリの使用方法に基づいて行われます。ただし、ドロップダウン ボックスが変更されたときに変更を保存するデザイン 3 も検討してください。ユーザーにとってワンクリックが少なくなります

Q2 および Q3: listBox で setName を使用する必要があります

var lboxActions = myApp.createListBox().setId(id).setName(id);

混乱を避けるために、通常は ID と名前に同じ文字列を使用しますが、setName を使用する必要があります。

e.parameter.id

最後に、buttonSave では、addChangeHandler の代わりに addClickHandler を使用する必要があります。

于 2012-07-20T08:24:04.510 に答える