HelloitsIan
HelloitsIan

Reputation: 43

How to use multiple arguments in Google App Script function and check what radio box is checked across HTMLService?

HTML Page:

  <html>
      <body>
    <div id="addGamePrompt">
    <form>
    First Pick Team: 
    <div id="containerT1"><input type="text" id="team1" name="team1"> My Team <input type="radio" name="myTeam" value="team1" id="checkTeam1" checked></div>
    <br><br>
    Second Pick Team: 
    <div id="containerT2"><input type="text"id="team2" name="team2"> My Team <input type="radio" name="myTeam" value="team2" id="checkTeam2">
    <br></div>
</form>
</div>

    <input id="submitBut" type="button" onClick="formSubmit()" value="Ok"/>
    <script type="text/javascript">

        function formSubmit() {
        google.script.run.getTeams(document.forms[0], 1);
        }

    </script>

  </body>
</html>

Google App Script

function myFunction() {
     // Display a modal dialog box with custom HtmlService content.
     var htmlOutput = HtmlService
         .createHtmlOutputFromFile('addGamePrompt.html')
         .setWidth(300)
         .setHeight(130);
     SpreadsheetApp.getUi().showModalDialog(htmlOutput, 'Enter Teams');

    }
    function getTeams(form,flag1){
      var arg1 = arguments[0]; //form argument value
      var arg2 = arguments[1]; //flag1 argument value
      var ss = SpreadsheetApp.getActiveSpreadsheet();
      var team1 = arg1.team1; //gets value of form in HTML page
      var team2 = arg1.team2; //see above
      var flagCheck = arg2; //sets flagCheck as whatever argument flag1 is
      ss.toast(team1); //prints out in box the value of team1
    }

I want to be able to pass the value of the text boxes, and check which radio box is checked through the google app script (if the first one is flag1=1 if the second one is flag1 =2), but nothing is happening.

NOTE: Using this in Google Sheets.

Upvotes: 3

Views: 5764

Answers (1)

Alan Wells
Alan Wells

Reputation: 31300

I would change the names for the radio buttons to:

name="myTeam1"
name="myTeam2"

You don't need to send the second parameter, just use:

google.script.run.getTeams(document.forms[0]);

Your server side code should be changed to:

function getTeams(form){
  //To see what is printed to the Log, use the View menu, and Logs
  Logger.log('team1: ' + form.team1);
  Logger.log('myTeam1: ' + form.myTeam1);
  Logger.log('team2: ' + form.team2);
  Logger.log('myTeam2: ' + form.myTeam2);

  var team1 = form.team1; //gets value of form in HTML page
  var team2 = form.team2; //see above

  var myTeam1 = form.myTeam1;//Get value of radio button
  var myTeam2 = form.myTeam2;

  //Whichever radio button is NOT checked will have a value of undefined
  var flagCheck = myTeam1?team1:team2; //sets flagCheck as whatever radio button is checked

  Logger.log('flagCheck: ' + flagCheck);

  var ss = SpreadsheetApp.getActiveSpreadsheet();
  ss.toast(team1); //prints out in box the value of team1
}

If a form element is passed with google.script.run.getTeams(formElement); then it must be the only parameter. You can't have two, or more parameters if you are passing a form element. So, I would create a new object, put the form answers into the object, put any other data or answers into the new object, and pass the object to the GS server function.

var dataObject = {};
dataObject.value1 = answerOne;
dataObject.value2 = answerTwo;
dataObject.value3 = answerThree;

google.script.run.getTeams(dataObject);

Upvotes: 2

Related Questions