Home > Mobile >  google web app not loading html in deployment but works in test
google web app not loading html in deployment but works in test

Time:12-25

I've made a web app on the Google Apps Script platform. It loads perfectly in test deployment, but once deployed it loads only the first heading <h1>Pre-Application Test</h1> and the last button. <br><button onclick="submitAnswer()">Submit Answer</button> What have a I done wrong?

Here's the code. QNA is a dictionary of values I'm passing in the doGet function

<html>
  <head>
    <base target="_top">
  </head>
  <body>
    <h1>Pre-Application Test</h1>  
    <h4> <?!= QNA["Question"] ?> </h4>
    <form>
          <input type="radio" name="choice" value= <?!= QNA["A"] ?> > <?!= QNA["A"] ?>
      <br><input type="radio" name="choice" value= <?= QNA["B"] ?> > <?= QNA["B"] ?>
      <br><input type="radio" name="choice" value= <?= QNA["C"] ?> > <?= QNA["C"] ?>
      <br><input type="radio" name="choice" value= <?= QNA["D"] ?> > <?= QNA["D"] ?>
    </form>
  
   <br><button onclick="submitAnswer()">Submit Answer</button>

   <script>     
      
      var submitAnswer = function() {

        var radios = document.getElementsByName('choice');
        var val= "";

        for (var i = 0, length = radios.length; i < length; i  ) {
          if (radios[i].checked) {
            val = radios[i].value; 
            break;
          }
        }
        
        if (val == "" ) {
          alert('Please choose an answer');
          //break;
        } else {
            alert('Thankyou. Now the next question will load')       
            window.open('<?=ScriptApp.getService().getUrl();?>?module=Grammar',name="_top")
        }
    };
    </script>
    

   
  </body>
</html>

Here is the GoogleScripts Code (excluding document ids):

//Global Variables
var PATSpreadsheetId = ID GOES HERE
var ResultsTabName = TAB NAME GOES HERE


function FindColumnOfCorrectAnswerTo(ThisTabsName, QuestionOnRow) {

  for (let col = 2; col < 6; col  ) { //1 indexxed
   if(SpreadsheetApp.openById(ID GOES HERE).getSheetByName(ThisTabsName).getRange(QuestionOnRow, col).getBackground()      !='#ffffff') {return col} //#ffffff is the hex code for no backfill colour
  }
  
  return 'No highlit answer found'
}

//why have this? So the spreadsheet details aren't viewable on the source code for the page
function Append(ThisResultSet,ToThisTab=ResultsTabName, 
OfThisSpreadsheetId=PATSpreadsheetId){
  SpreadsheetApp.openById(OfThisSpreadsheetId).getSheetByName(ToThisTab).appendRow(ThisResultSet)
  ;
}

function GenerateDropdownOptions(FromThisSpreadsheetId = PATSpreadsheetId, InThisTabName='List of course options',InColumnNumber=1,BeginningInRowNumber=2){
  
  Tabitha = SpreadsheetApp.openById(FromThisSpreadsheetId).getSheetByName(InThisTabName)
  cells = Tabitha.getSheetValues(BeginningInRowNumber,InColumnNumber,Tabitha.getLastRow(),1)
  options=[]

  for (let rower = 1; rower < cells.length ; rower  ) { //1 indexxed
    options.push('<option>' cells[rower] '</option>')
  }

  return options.join('')
}

function GetQuestionAndAnswers(FromThisSpreadsheetId=PATSpreadsheetId,InThisTabName){

  Tabitha = SpreadsheetApp.openById(FromThisSpreadsheetId).getSheetByName(InThisTabName)
  Rower = GetRandomIntInclusive(2,Tabitha.getLastRow())

  RawData =  Tabitha.getSheetValues(Rower,1,1,5)[0]
  return {
    Question: RawData[0]
    ,A:       RawData[1]
    ,B:       RawData[2]
    ,C:       RawData[3]
    ,D:       RawData[4]
    ,Answer:  RawData[FindColumnOfCorrectAnswerTo(InThisTabName,Rower)-1]//minus one because sporeadsheet 1 indexxed and array 0 indexxed. 
  }  
}

function GetRandomIntInclusive(min, max) {
  min = Math.ceil(min);
  max = Math.floor(max);
  return Math.floor(Math.random() * (max - min   1)   min); //The maximum is inclusive and the minimum is inclusive
}


//This function is a special function that loads the html to the webb app 
function doGet(e){
  //this determines which module to load
  //Obviously this would be best with a switch statement, but it just wouldn't recognise the parameter. Guessing it was some sort of object thing. Anyway we'll just have to if else till the cows come home 
  if(e.parameters.module=='Grammar'){
      var Siter = HtmlService.createTemplateFromFile('Grammar Test')
      //now we pass variables to this template
      Siter.QNA = GetQuestionAndAnswers()
      return Siter.evaluate();

    }else{
      var Siter = HtmlService.createTemplateFromFile('PAT Webb App')
      //now we pass variables to this template
      Siter.CourseOptions = GenerateDropdownOptions(PATSpreadsheetId,'List of course options',1,1)
      return Siter.evaluate();}
  
}

Thanks

CodePudding user response:

Thanks for your help guys

It turned out the problem was ScriptApp.getService().getUrl() . When I updated the deployment, one view got updated but the Grammar view somehow got stuck on the old version! I tried re-deploying many times, and even archiving all the old views but this just gave an error message that the file couldn't be loaded.

The solution was to put the full URL for each view into every place it was referenced. So no more new deployments, only new versions from now on.

  • Related