title: Can one use If/Else statements in HTML side of Google Script WebApp?
body: <p>This question is a follow-on question to: <a href="https://stackoverflow.com/questions/56338899/can-one-create-an-interactive-web-app-with-gas">Can one create an Interactive web app with GAS?</a></p>
  <p>I am writing a script that should do the following:</p>
  <ul>
  <li>Ask the user for their user number</li>
  <li>Ask the user for a row number from a spreadsheet (if they know it) and some additional info.
  <ul>
  <li>If they don't know the row, get the row for them and display it.</li>
  </ul>
  </li>
  <li>Ask them for the additional info.</li>
  </ul>
  <p>This obviously requires an if/else statement. I just don't know how to form it.</p>
  <p>I have attempted to put the code on the client and server side and neither works. I have also realized that some JS seems to run on the client side and some does not Accordingly, I have researched client side JS, in general, but not found specific rules for what works and doesn't.</p>
  <h1>html</h1>
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
    &lt;head&gt;
      &lt;base target=&quot;_top&quot;&gt;
    &lt;/head&gt;
    &lt;body&gt;
    &lt;center&gt;
  Enter your User ID below. If you are re-using a row in your Catalog Spreadsheet (meaning you know the row number),&lt;br&gt;
  enter it below in the &quot;Song ID&quot; field, enter the Song Title, and then click the &quot;Continue&quot; button. Else, enter your&lt;br&gt; 
  User ID only and click the &quot;Continue&quot; button. We will find the next avalable empty row at the end of your Catalog&lt;br&gt;
  Spreadsheet and display its value to you. Then you may enter it and your Song Title. After you do, click the&lt;br&gt; 
  &quot;Continue&quot; button to create the lyric sheet and add the new song to your Catalog Spreadsheet.&lt;br&gt;&lt;br&gt;
  
  Note: We will automatically add your name to the lyric sheet as the songwriter. Add additional writers manually&lt;br&gt;
  on the lyric sheet.&lt;br&gt;&lt;br&gt;
  
  &lt;div&gt;
  &lt;input id=&quot;user&quot; type=&quot;text&quot; placeholder=&quot;User ID&quot;&gt;&lt;br&gt;&lt;br&gt;
  &lt;div  id=&quot;results&quot;&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;input id=&quot;song&quot; type=&quot;text&quot; placeholder=&quot;Song ID&quot;&gt;&lt;br&gt;&lt;br&gt;
  &lt;input id=&quot;title&quot; type=&quot;text&quot; placeholder=&quot;Song Title&quot;&gt;&lt;br&gt;&lt;br&gt;
  &lt;input type=&quot;button&quot; value=&quot;Continue&quot; onclick=&quot;saveUserInput()&quot;&gt;&lt;br&gt;&lt;br&gt;
  &lt;/center&gt;
  &lt;script&gt;
        
     function saveUserInput() {
       var userId = document.getElementById('userId').value;
       var songId = document.getElementById('userId').value;
        if(songId != &quot;&quot;){
          window.saveUserInput = function() {
           var userId = document.getElementById('userId').value;
           var songId = document.getElementById('songId').value;
           var songTitle = document.getElementById('idNewSongTitle').value;
               console.log('songTitle: ' + songTitle)
           google.script.run
               .withSuccessHandler(openPrompt)
               .getSongId({userId:userId, songId:songId, songTitle:songTitle})
        }
        }
        else {
         google.script.run
            .withSuccessHandler(function(hl){
              document.getElementById('results').innerHTML=hl;
            })
            .getSongId({userId:userId})
        }
  
         function openPrompt(results){
             window.open(results.url, '_blank').focus();
        }
        }
      &lt;/script&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  <h1>gs</h1>
  <pre><code>function doGet() {
    return HtmlService.createHtmlOutputFromFile('Index');
  }
  
  function getSongId(uObj) {
    var userId = uObj.userId;
    var songId = uObj.songId;
    var songTitle = uObj.songTitle;
      
     if(songId !=&quot;&quot;){
          
  Code not included to keep this brief, but it has been tested in other applications of this project and works and what it does is: if the user has entered a Song ID, this code creates the new lyric sheet and adds the new song name to the Catalog SS.
       
        }
       else{
          
  This code does this:
       return ('The next available row for the new song is '+songId);
          }
  }
  </code></pre>
  <p>When I run what I have the Execution Transcript output is:</p>
  <ul>
  <li>[19-05-29 07:54:16:951 EDT] Starting execution</li>
  <li>[19-05-29 07:54:16:959 EDT] HtmlService.createHtmlOutputFromFile([Index]) [0 seconds]</li>
  <li>[19-05-29 07:54:16:961 EDT] HtmlOutput.getContent() [0 seconds]</li>
  <li>[19-05-29 07:54:16:961 EDT] HtmlOutput.getTitle() [0 seconds]</li>
  <li>[19-05-29 07:54:16:962 EDT] Execution succeeded [0.003 seconds total runtime]</li>
  </ul>