Passing selected value of a listbox to another listbox in google-apps-script

Wale

I am building a google apps UI and I am having trouble determining the value of an item in one listbox from the call back event in a separate listbox. I tried passing hidden events but this did not work out. How do I pass the selected grade to _clickCourse

This is a rough description of the code in english:

1) Populate the first listbox with all available unique grades 2) Attach a function to be triggered when the content of the grade listbox changes 3) In the function created in 2, I know the selected grade via the even, use that info to filter on the correct courses, populate the course listbox with the valid courses. 4) Attach a callback function to the courses listbox 5) Inside this function, filter on the selected grade + selected course to determine the valid semesters.

... The issue is that the last Function knows the selected course via the event that google UI passed to it, but it does not know the selected grade.

Sample Data:

Grade    Semester     Course                 Unit
1          1        Chemistry101         Chemistry
3          2        Physics321            Physics
2          1        Chemistry101         Chemistry


 function executionStartsHere() { 
   var doc = SpreadsheetApp.getActiveSpreadsheet();
   var app = UiApp.createApplication().setTitle('Course Planner');
   var panel = app.createVerticalPanel();
   panel.setId("main-panel");


   //grades
   panel.add(_getLabel("Grades"));
   uniqueGrades = _findUniqueGrades();
   gradeListBox = _getListBox(app,uniqueGrades,"grade-listbox","grades");
   var gradeHandler = app.createServerHandler('_clickGrade');
   gradeListBox.addChangeHandler(gradeHandler);
   panel.add(gradeListBox);

   //courses
   panel.add(_getLabel("Courses"));
   courseListBox = _getListBox(app,{},"course-listbox","courses");
   var courseHandler = app.createServerHandler('_clickCourse');
   courseListBox.addChangeHandler(courseHandler);
   panel.add(courseListBox);

   //semester
   panel.add(_getLabel("Semester"));
   semesterListBox = _getListBox(app,{},"semester-listbox","semesters");
   panel.add(semesterListBox);


   h = app.createHidden("selectedGrade").setId("selectedGrade");
   h.setValue("1");
   panel.add(h);

   //finally
   app.add(panel);
   doc.show(app);  
 }


 function _clickGrade(eventInfo) {
   var app = UiApp.getActiveApplication();
   // get value of ListBox based on name
   var selectedGrade = eventInfo.parameter.grades;
   Logger.log("In clickGrade, selected:"+selectedGrade);
   //eventInfo.parameter.selectedGrade=selectedGrade;
   app.getElementById("selectedGrade").setValue(selectedGrade);
   Logger.log("eventInfo.parameter.selectedGrade: "+eventInfo.parameter.selectedGrade);
    _displayCourses(selectedGrade);
   return app;
 }

 function _clickCourse(eventInfo) {
   //WE NEED TO SOMEHOW PASS THE SELCTED GRADE IN HERE

   var app    = UiApp.getActiveApplication();
   var grade  = app.getElementById("selectedGrade")
   var grade2 = eventInfo.parameter.selectedGrade;
   var course = eventInfo.parameter.courses;
    Logger.log("Selected grade, grade2, course: "+grade+" ,"+grade2+" ,"+course);
   _displaySemesters(grade,course);
   return app;
 }

 function _displayCourses(grade) {
   var app = UiApp.getActiveApplication();
   validCourses = _findValidCourses(grade);
   lb = app.getElementById("course-listbox");
   _populateListBox(lb,validCourses);
 }

 function _displaySemesters(grade,course){
   var app = UiApp.getActiveApplication();
   validSemesters = _findValidSemesters(grade,course);
   lb = app.getElementById("semester-listbox");
   _populateListBox(lb,validSemesters);
 }


 function _findUniqueGrades(){
   var workBook = _getWorkBook(); 
   var sheet = _getLearningOutcomeSheet(workBook);
   var graderows = getColumnAsArray(sheet, 1); 

   var grades= {}; 
   for(var i=1; i<graderows.length; i++) { //skip the first row (labels)
     if(graderows[i] != "" && graderows[i] != undefined ) {
       grades[graderows[i]]=graderows[i];
     }
   }
   return grades;
 }

 function _findValidCourses(grade) {
  var workBook = _getWorkBook();
  var sheet = _getLearningOutcomeSheet(workBook);
  var graderows = getColumnAsArray(sheet, 1); 
  var courserows = getColumnAsArray(sheet, 3);

  // loop over courserows
  //  if the grade for this courserow matches the grade we are searching for
  //     then store this courserow in an associative array
  validCourses = {};
  for(var i=0; i< courserows.length; i++) {
    if ( graderows[i] == grade ) {
      validCourses[courserows[i]] = courserows[i];
    }
  }
  return validCourses;
 } 

 function _findValidSemesters(grade,course){
  var workBook     = _getWorkBook();
  var sheet        = _getLearningOutcomeSheet(workBook);
  var graderows    = getColumnAsArray(sheet, 1);
  var courserows   = getColumnAsArray(sheet, 3);
  var semesterrows = getColumnAsArray(sheet, 2); 

   validSemesters = {};
   for(var i=0; i< semesterrows.length; i++){
     if ( courserows[i] == course && graderows[i] == grade ){
       validSemesters[semesterrows[i]] = semesterrows[i];
     }
   }
   return validSemesters;
 }

 function _getListBox(app,items,id,label){
   var lb = app.createListBox().setId(id).setName(label);
   lb.setVisibleItemCount(1);
   //add items, if any
   for each ( i in items) {
     lb.addItem(i);
   }
   return lb;
 } 

 function _populateListBox(listBox,items){
   listBox.clear();
   Logger.log("ListBox ID: "+ listBox.getId());
   for each ( i in items) {
     Logger.log("adding item: " + i);
     listBox.addItem(i);
   }
 }

 function _getWorkBook(){
   return SpreadsheetApp.openById(employee_SPREADSHEET);
 }

 function _getLearningOutcomeSheet(workBook){
   return workBook.getSheets()[0];
 }

 function _getLabel(string){
   var app = UiApp.getActiveApplication();
   return app.createLabel(string); 
 }

 function getColumnAsArray(sheet,column) {
  var dataRange = sheet.getRange(1,column,99,1);
  var data = dataRange.getValues()
  //Logger.log("column values: " + data);

  return data;
 }
Serge insas

I think that you simply forgot to set a Name to your hidden widget , you only gave an ID... and as you obviously know the event parameter uses the widgets name to get back its value. :-)

h = app.createHidden("selectedGrade").setId("selectedGrade").setName("selectedGrade");

EDIT :

Oooops, you're right, I didn't notice at first.

After playing a bit with your code I found that you where forgeting a callBackElement with your handler, I also added a second hidden widget to hold the course value. Here is a copy of your code in which I replaced the hidden widgets by textBoxes to see what was happening. It seems to work as expected, you can hide the textBoxes when everything is ok or replace them by hidden widgets again.

 function executionStartsHere() { 
   var doc = SpreadsheetApp.getActiveSpreadsheet();
   var app = UiApp.createApplication().setTitle('Course Planner');
   var panel = app.createVerticalPanel();
   panel.setId("main-panel");


   //grades
   panel.add(_getLabel("Grades"));
   uniqueGrades = _findUniqueGrades();
   gradeListBox = _getListBox(app,uniqueGrades,"grade-listbox","grades");
   var gradeHandler = app.createServerHandler('_clickGrade').addCallbackElement(panel);
   gradeListBox.addChangeHandler(gradeHandler);
   panel.add(gradeListBox);

   //courses
   panel.add(_getLabel("Courses"));
   courseListBox = _getListBox(app,{item:'First choose a grade value'},"course-listbox","courses");
   var courseHandler = app.createServerHandler('_clickCourse').addCallbackElement(panel);
   courseListBox.addChangeHandler(courseHandler);
   panel.add(courseListBox);

   //semester
   panel.add(_getLabel("Semester"));
   semesterListBox = _getListBox(app,{item:'First choose a course value'},"semester-listbox","semesters");
   panel.add(semesterListBox);


   var h = app.createTextBox().setName("selectedGrade").setId("selectedGrade");
   var h2 = app.createTextBox().setName("selectedCourse").setId("selectedCourse");
   panel.add(h).add(h2);

   //finally
   app.add(panel);
   doc.show(app);  
 }


 function _clickGrade(eventInfo) {
   var app = UiApp.getActiveApplication();
   // get value of ListBox based on name
   var selectedGrade = eventInfo.parameter.grades;
   Logger.log("In clickGrade, selected:"+selectedGrade);
   //eventInfo.parameter.selectedGrade=selectedGrade;
   app.getElementById("selectedGrade").setValue(selectedGrade);
   Logger.log("eventInfo.parameter.selectedGrade: "+eventInfo.parameter.selectedGrade);
    _displayCourses(selectedGrade);
   return app;
 }

 function _clickCourse(eventInfo) {
   //WE NEED TO SOMEHOW PASS THE SELCTED GRADE IN HERE

   var app    = UiApp.getActiveApplication();
   var grade  = app.getElementById("selectedGrade")
   var grade2 = eventInfo.parameter.selectedGrade;
   var course = eventInfo.parameter.courses;
   app.getElementById("selectedCourse").setValue(course);
    Logger.log("Selected grade, grade2, course: "+grade+" ,"+grade2+" ,"+course);
   _displaySemesters(grade2,course);
   return app;
 }

 function _displayCourses(grade) {
   var app = UiApp.getActiveApplication();
   validCourses = _findValidCourses(grade);
   lb = app.getElementById("course-listbox");
   _populateListBox(lb,validCourses);
 }

 function _displaySemesters(grade,course){
   var app = UiApp.getActiveApplication();
   Logger.log(grade+' '+course)
   validSemesters = _findValidSemesters(grade,course);
   lb = app.getElementById("semester-listbox");
   _populateListBox(lb,validSemesters);
 }


 function _findUniqueGrades(){
   var workBook = _getWorkBook(); 
   var sheet = _getLearningOutcomeSheet(workBook);
   var graderows = getColumnAsArray(sheet, 1); 

   var grades= {}; 
   for(var i=1; i<graderows.length; i++) { //skip the first row (labels)
     if(graderows[i] != "" && graderows[i] != undefined ) {
       grades[graderows[i]]=graderows[i];
     }
   }
   return grades;
 }

 function _findValidCourses(grade) {
  var workBook = _getWorkBook();
  var sheet = _getLearningOutcomeSheet(workBook);
  var graderows = getColumnAsArray(sheet, 1); 
  var courserows = getColumnAsArray(sheet, 3);

  // loop over courserows
  //  if the grade for this courserow matches the grade we are searching for
  //     then store this courserow in an associative array
  validCourses = {};
  for(var i=0; i< courserows.length; i++) {
    if ( graderows[i] == grade ) {
      validCourses[courserows[i]] = courserows[i];
    }
  }
  return validCourses;
 } 

 function _findValidSemesters(grade,course){
  var workBook     = _getWorkBook();
  var sheet        = _getLearningOutcomeSheet(workBook);
  var graderows    = getColumnAsArray(sheet, 1);
  var courserows   = getColumnAsArray(sheet, 3);
  var semesterrows = getColumnAsArray(sheet, 2); 

   validSemesters = {};
   for(var i=0; i< semesterrows.length; i++){
     if ( courserows[i] == course && graderows[i] == grade ){
       validSemesters[semesterrows[i]] = semesterrows[i];
     }
   }
   return validSemesters;
 }

 function _getListBox(app,items,id,label){
   var lb = app.createListBox().setId(id).setName(label);
   lb.setVisibleItemCount(1);
   //add items, if any
   for each ( i in items) {
     lb.addItem(i);
   }
   return lb;
 } 

 function _populateListBox(listBox,items){
   listBox.clear();
   Logger.log("ListBox ID: "+ listBox.getId());
   for each ( i in items) {
     Logger.log("adding item: " + i);
     listBox.addItem(i);
   }
 }

 function _getWorkBook(){
   return SpreadsheetApp.getActiveSpreadsheet()
 }

 function _getLearningOutcomeSheet(workBook){
   return workBook.getSheets()[0];
 }

 function _getLabel(string){
   var app = UiApp.getActiveApplication();
   return app.createLabel(string); 
 }

 function getColumnAsArray(sheet,column) {
  var dataRange = sheet.getRange(1,column,99,1);
  var data = dataRange.getValues()
  //Logger.log("column values: " + data);

  return data;
 }

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

From Dev

Populating a listbox by comparing another listbox value

From Dev

Trouble accessing selected value in Listbox

From Dev

Get the selected index and selected value of a ListBox

From Dev

How to get Multiple selected listbox items to another listbox

From Dev

Listbox selected item text to another textbox

From Dev

Unable to bind the selected value from listbox

From Dev

How to get listbox selected item value

From Dev

How to get selected value in multicolumn listbox

From Dev

Get the exact selected value from listbox in angularjs

From Dev

Why is selected value null in wpf listbox?

From Dev

Listbox binding get selected item value

From Dev

List Picker selected value and listbox selected value in Windows Phone

From Dev

Windows Phone 7 - Passing / transferring selected data from listbox

From Dev

VB 2013 Passing Listbox Selected Items to a Background Worker

From Dev

Passing JSON value from Spreadsheet in Google Apps Script

From Dev

Passing listBox to a new form

From Dev

Foreach selected item in Listbox?

From Dev

MVC ListBox Selected Values

From Dev

ListBox (multiselect) selected indexes

From Dev

ListBox: Item selected is not highlighted

From Dev

Accessing Selected Index of ListBox

From Dev

Selected items from listbox

From Dev

ListBox get selected index?

From Dev

How to Add Items to Selected Listbox1 Items in another Listbox2 items in?

From Dev

How to show Listbox selected item (Image) in an another Control with larger size

From Dev

How to get selected item of a listbox within a listbox

From Dev

Displaying the value of a property from a class according to selected item in listbox

From Dev

Get selected value instantly on listbox without clicking it first GUI

From Dev

Move item from one listBox to another listBox

Related Related

  1. 1

    Populating a listbox by comparing another listbox value

  2. 2

    Trouble accessing selected value in Listbox

  3. 3

    Get the selected index and selected value of a ListBox

  4. 4

    How to get Multiple selected listbox items to another listbox

  5. 5

    Listbox selected item text to another textbox

  6. 6

    Unable to bind the selected value from listbox

  7. 7

    How to get listbox selected item value

  8. 8

    How to get selected value in multicolumn listbox

  9. 9

    Get the exact selected value from listbox in angularjs

  10. 10

    Why is selected value null in wpf listbox?

  11. 11

    Listbox binding get selected item value

  12. 12

    List Picker selected value and listbox selected value in Windows Phone

  13. 13

    Windows Phone 7 - Passing / transferring selected data from listbox

  14. 14

    VB 2013 Passing Listbox Selected Items to a Background Worker

  15. 15

    Passing JSON value from Spreadsheet in Google Apps Script

  16. 16

    Passing listBox to a new form

  17. 17

    Foreach selected item in Listbox?

  18. 18

    MVC ListBox Selected Values

  19. 19

    ListBox (multiselect) selected indexes

  20. 20

    ListBox: Item selected is not highlighted

  21. 21

    Accessing Selected Index of ListBox

  22. 22

    Selected items from listbox

  23. 23

    ListBox get selected index?

  24. 24

    How to Add Items to Selected Listbox1 Items in another Listbox2 items in?

  25. 25

    How to show Listbox selected item (Image) in an another Control with larger size

  26. 26

    How to get selected item of a listbox within a listbox

  27. 27

    Displaying the value of a property from a class according to selected item in listbox

  28. 28

    Get selected value instantly on listbox without clicking it first GUI

  29. 29

    Move item from one listBox to another listBox

HotTag

Archive