<script>
  return {
    data: function() {
      var app = new Framework7();
      //start view json
        app.request.json('http://localhost/mobile/viewuser.php',
          function (data){
          document.getElementById("status").style.display = "block";
            nomor=0;
            if(!data.length){
            } else {
              for(var x=0; x < data.length; x++){
                var iduser=data[x].id_user;
                var namauser=data[x].nama_user;
                var leveluser=data[x].level_user;
                nomor=x+1;
                buatTabel="";
                buatTabel+="<tr><td>"+nomor+"</td>"+
                "<td>"+iduser+"</td>"+
                "<td>"+namauser+"</td>"+
                "<td>"+leveluser+"</td>"+
                "<td class='actions-cell'><a class='link icon-only'><i class=' material-icons'>edit</i></a><a class='link icon-only'><i class=' material-icons'>delete</i></a></td></tr>";

                document.getElementsByTagName("table")[0].innerHTML += buatTabel;
                 document.getElementById("status").style.display = "none";

              }
            }
          },
          function (status){
              alert("Tidak Terhubung Ke Server"+status);
          });
      //end view json

      //start tambah data
        $(document) .ready(function() {

          $("#tambahdata").click(function() {
            var username = $("#username").val();
            var nama = $("#nama").val();
            var password = $("#password").val();
            var leveluser = $("#leveluser").val();

            var dataString = "username=" + username + "&nama=" + nama + "&password=" + password + "&leveluser=" + leveluser + "&insert=";
            //alert (dataString);
            if ($.trim(username).length > 0 & $.trim(nama).length > 0 & $.trim(password).length > 0) {
              $.ajax({
                  type:"POST",
                  url:"http://localhost/mobile/adduser.php",
                  data: dataString,
                  crossDomain: true,
                  cache: false,
                  beforeSend: function() {
                      $("#tambahdata").val('Connecting...');
                  },
                  success: function(data) {
                    if (data == "success") {
                      //alert("inserted");
                    document.getElementById("status").style.display = "block";
                        $("#tambahdata").val('Tambah');
                        nomor=nomor+1
                        hasiltambah="";
                        hasiltambah += "<tr><td class=''>"+nomor+"</td>"+
                                       "<td class='label-cell style='text-align:center;'>"+username+"</td>"+
                                        "<td class='label-cell'>"+nama+"</td>"+
                                       "<td class='label-cell'>"+leveluser+"</td>"+
                "<td class='actions-cell'><a class='link icon-only'><i class=' material-icons'>edit</i></a><a class='link icon-only'><i class=' material-icons'>delete</i></a></td></tr>";
                document.getElementsByTagName("table")[0].innerHTML += hasiltambah;

                var toastCenter = app.toast.create({
                  text: 'Data sudah ditambah',
                  position: 'center',
                    closeTimeout: 3000,
                });
                toastCenter.open();
                  document.getElementById("status").style.display = "none";
                  $("#username").val('');
                  $("#nama").val('');
                  $("#password").val('');
                  $("#leveluser").val('');
                    } else if (data == "error") {
                      alert("Terjadi error pada backend");
                    }
                  }
              });
            } else {
              alert("isi data bro");
            }
            return false;
            });
            });
      //end tambah data
    }
  }
</script>