From [How can I add multiple inputs from an HTML UI to a Google Spreadsheet?](https://stackoverflow.com/questions/34325826/how-can-i-add-multiple-inputs-from-an-html-ui-to-a-google-spreadsheet) I have copied the following script from the top answer, and made **2 additions** which I've marked with comments in the scripts below.

**addItem.gs**

*Addition #2 has been made to the file below*

```
function openInputDialog() {
  var html = HtmlService.createHtmlOutputFromFile('Index').setSandboxMode(HtmlService.SandboxMode.IFRAME);
  SpreadsheetApp.getUi()
       .showModalDialog(html, 'Add Item');
}

function itemAdd(form) {
  var ss = SpreadsheetApp.getActiveSpreadsheet();
  var sheet = ss.getSheets()[0];
  //Addition #2
  document.getElementById("status_value").innerHTML = "Submitted!"; 
  sheet.appendRow(["  ", form.category, form.item, form.manupub, form.details, form.quantity]);
  return true;
}

```

**Index.html**

*Addition #1 has been made to the file below*

```
<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <br>
  <form>
    Category:<br>
    <input type="text" name="category">
    <br>
    Item:<br>
    <input type="text" name="item">
    <br>
    Manufacturer or Publisher:<br>
    <input type="text" name="manupub">
    <br>
    Details:<br>
    <input type="text" name="details">
    <br>
    Quantity:<br>
    <input type="text" name="quantity">
    <br><br>
     <input type="button" value="Submit"
        onclick="google.script.run
            .withSuccessHandler(google.script.host.close)
            .itemAdd(this.parentNode)" />
    </form>
    <!-- Addition #1 -->
    <p>Status: </p><p id="status_value"></p>
</html>

```

**Problem:**

The script above fails when it gets to Addition #2. It seems it cannot find the id=*status\_value* element in the html.

**Note:**

I want the html to be updated from the .gs script file because, I have use cases where the script may take a while, I want to change the status message as the script gets to certain milestones in the script.