BudgetSheet-Google-App-Script/AddExpense.html at master · StAmourD/BudgetSheet-Google-App-Script · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons1.css">
    <style>
      label{
        display: inline-block;
        float: left;
        clear: left;
        width: 100px;
        text-align: right;
      }
      input {
        display: inline-block;
        width: 60%;
        float: left;
      }
      #addBtn {
        margin-right: 15px;
        float: right;
      }
    </style>
  </head>
  <body>
    <label for="catName">Category name: </label>
    <input id="catName"/>
    <br><br>
    <label for="catAmount">Amount: </label>
    <input id="catAmount"/>
    <br><br>
    <button id="addBtn" class="red" onclick="addRow()">Add</button>
    <button id="cancelBtn" onclick="closeModal()">Cancel</button>

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script>
      function addRow() {
        var catName = $('#catName').val();
        var catAmount = $('#catAmount').val();
        google.script.run.InsertNewExpense(catName, catAmount);
        google.script.host.close();
      }

      function closeModal() {
        google.script.host.close();
      }
    </script>
  </body>
</html>