Untitled

<html>

  <head>
    <link href="css/yourHours.css" rel="stylesheet">
    <script src="js/yourHours.js"></script>
  </head>

  <body>
    <div id="hours" class="container">
      <form id="hoursForm" name="hoursForm" class="form-horizontal">

        <fieldset>

          <legend>
                        <div class="dateHeader">
                            <ul>

                                <li>
                                    <a id="backDay" type="button" class="btn btn-default btn-lg" onclick="subDay()">
                                        <span class="glyphicon glyphicon-chevron-left"></span>
                                    </a>
                                </li>
                                <li class="hide">
                                    <button id="calandar" type="button" class="btn btn-default btn-lg">
                                        <span class="glyphicon glyphicon-calendar"></span>
                                    </button>
                                </li>
                                <li>
                                    <a id="forwardDay" type="button" class="btn btn-default btn-lg" onclick="addDay()">
                                        <span class="glyphicon glyphicon-chevron-right"></span>
                                    </a>
                                </li>
                                <li>
                                    <h2 id="dateReplace" style="font-size: 30px; display: inline;"></h2>
                                </li>

                            </ul>
                        </div>
          </legend>

<!-- Row 1 -->
          <div class="form-group col-md-5">
            <label class="control-label" for="taskInput">Task</label>
            <input id="taskInput" class="form-control" type="text">
          </div>

          <div class="col-offset col-md-2"></div>

          <div class="form-group col-md-5">
            <label class="control-label" for="payCode">Pay Code</label>
            <select id="payCode" class="form-control">
              <option value="">Select</option>
              <option value="">1</option>
              <option value="">2</option>
              <option value="">3</option>
              <option value="">4</option>
            </select>
          </div>
<!-- Row 1 -->

<!-- Row 2 -->
          <div class="form-group col-md-5">
            <label class="control-label" for="startTime">Start Time (24 Hr)</label>
            <input id="startTime" name="startTime" class="form-control" type="time">
          </div>

          <div class="col-offset col-md-2"></div>

          <div class="form-group col-md-5">
            <label class="control-label" for="finishTime">Finish Time (24 Hr)</label>
            <input id="finishTime" name="finishTime" class="form-control" type="time">
            <label class="control-label" for="nextday">Next Day?</label>
            <input id="nextDay" name="nextday" type="checkbox">
          </div>
<!-- Row 2 -->

<!-- Row 3 -->
          <div class="form-group col-md-5">
            <label class="control-label" for="breaksTime">Total Breaks Time (Hrs)</label>
            <input class="form-control" type="text" id="breaksTime">
          </div>

          <div class="col-offset col-md-2"></div>

          <div class="form-group col-md-5">
            <label class="control-label" for="totalHours">Total Hours</label>
            <input id="totalHours" name="totalHours" class="form-control" readonly="readonly" data-hourcheck="hourcheck" data-hourcheck-error="Total hours must be positive.">
            <span class="help-block with-errors"></span>
          </div>
                </fieldset>

            </form>
        </div>
<!-- Row 3 -->

<!-- Row 4 -->
        <div id="expenses" class="container">

            <legend style="font-size: 20px;">
                Expenses
            </legend>

            <button id="expenseCollapse" class="btn btn-primary" data-toggle="collapse" data-target="#newExpense">
                Create New Expense
            </button>

            <div id="newExpense" class="container row collapse">

                <div id="expenseFields" class="col-md-6">
                    <form id="expenseForm" class="form-vertical" data-toggle="validator">

                        <fieldset>

                            <legend style="padding-top: 4%; font-size: 18px;">
                                New Expense
                            </legend>

                            <div id="titleID" class="form-group has-feedback col-md-5">
                                <label class="control-label" for="expenseTitle">Title</label>
                                <input id="expenseTitle" name="expenseTitle" class="form-control" type="text" required>
                                <span class="help-block with-errors"></span>
                                <span id="add" class="glyphicon form-control-feedback fix"></span>
                            </div>

                            <div class="col-offset col-md-2"></div>

                            <div id="valueID" class="form-group has-feedback col-md-5">
                                <label class="control-label" for="expenseValue">Value (£)</label>
                                <input id="expenseValue" class="form-control" type="text" required>
                                <span id="add" class="help-block with-errors"></span>
                                <span class="glyphicon form-control-feedback fix"></span>
                            </div>

                            <div class="form-group col-md-8">
                                <label class="control-label" for="receipt">Receipt?</label>
                                <input id="recipt" type="checkbox">
                            </div>

                            <div class="col-offset col-md-10"></div>

                            <div class="form-group col-md-6">
                                <button id="createExpense" type="button" class="form-control btn btn-primary" onclick= "checkValid()">
                                    Submit
                                </button>
                            </div>

                        </fieldset>

                    </form>
                </div>

                <div class="table-responsive col-md-6" style="padding-top: 0.6%;">
                    <fieldset>

                        <table id="expenseTable" class="table">

                            <thead>
                                <tr>
                                    <th>Title</th>
                                    <th>Value (£)</th>
                                    <th>Recipt</th>
                                    <th>Delete</th>
                                </tr>
                            </thead>

                            <tbody>
                                <tr id="expense0"></tr>
                            </tbody>

                        </table>

                    </fieldset>
                </div>
            </div>
<!-- Row 4 -->

<!-- Row 5 -->

            <div id="submit" class="container row">

                <div class="form-group" style="padding-top: 2%;">
                    <label class="control-label" for="comments">Comments</label>
                    <textarea id="comments" class="form-control" rows="2"></textarea>
                </div>

                <button id="submitHours" type="button" class="btn btn-primary" onclick="sendHours()">
                    Submit Hours
                </button>

            </div>

<!-- Row 5 -->

        </div>
        <script>
            function d(){
                var startTime = document.getElementById("startTime").value;
                console.log(startTime);
                $.ajax({
                    type: "POST",
                    url: "sendHours.php",
                    data: {startTime: startTime},
                    success: function(data){
                        console.log(data);
                    }
                })
            }
        </script>
  </body>
</html>