perbaikan 63

<!--START HERE-->
  <body onload="viewData()">
    <p><br/></p>

    <div class="container">
      <p></p>
      <button class="btn btn-primary" data-toggle="modal" data-target="#addData">Insert Data</button>
      <!-- Modal -->
      <div class="modal fade" id="addData" tabindex="-1" role="dialog" aria-labelledby="addLabel">
        <div class="modal-dialog" role="document">
          <div class="modal-content">
            <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
              <h4 class="modal-title" id="addLabel">Insert Data</h4>
            </div>

            <div class="modal-body">

              <div class="form-group">
                <label for="nm">Full Name</label>
                <input type="text" class="form-control" id="nm" placeholder="Nama Lengkap">
              </div>
              <div class="form-group">
                <label for="em">Email</label>
                <input type="email" class="form-control" id="em" placeholder="Surel">
              </div>
              <div class="form-group">
                <label for="hp">Phone Number</label>
                <input type="number" class="form-control" id="hp" placeholder="Nomor Telp/HP">
              </div>
              <div class="form-group">
                <label for="al">Address</label>
                <textarea class="form-control" id="al" placeholder="Alamat"></textarea>
              </div>

            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
              <button type="submit" onclick="saveData()" data-dismiss="modal" class="btn btn-primary">Save</button>
            </div>

          </div>
        </div>
      </div>
      <div id="result"></div>
      <p></p>
      <table class="table table-bordered table-striped">
        <thead>
          <tr>
            <th width="40">ID</th>
            <th>Name</th>
            <th>Email</th>
            <th>Phone</th>
            <th>Address</th>
            <th width="160">Action</th>
          </tr>
        </thead>
        <tbody>

        </tbody>
      </table>
    </div>


    <script>
      function saveData(){
        var name = $('#nm').val();
        var email = $('#em').val();
        var phone = $('#hp').val();
        var address = $('#al').val();
        $.ajax({
          type: "POST",
          url: "server.php?p=add",
          data: "nm="+name+"&em="+email+"&hp="+phone+"&al="+address,
          success: function(data){
            viewData();
          }
        });
      }

      function viewData(){
        $.ajax({
          type: "GET",
          url: "server.php",
          success: function(data){
            $('tbody').html(data);
          }
        });
      }

      function updateData(str){
        var id = str;
        var name = $('#nm-'+str).val();
        var email = $('#em-'+str).val();
        var phone = $('#hp-'+str).val();
        var address = $('#al-'+str).val();
        $.ajax({
          type: "POST",
          url: "server.php?p=edit",
          data: "nm="+name+"&em="+email+"&hp="+phone+"&al="+address+"&id="+id,
          success: function(data){
               $(".modal-backdrop.in").hide();
              console.log('tutup modal?');

            viewData();
          }
        });
      }

      function deleteData(str){
        var id = str;
        $.ajax({
          type: "GET",
          url: "server.php?p=del",
          data: "id="+id,
          success: function(data){
            viewData();
          }
        });
      }


    </script>

  </body>
<!-- END HERE--->