Halo Dumenity selamat datang kembali di website tips dan trik Dumet School, berjumpa kembali dengan saya pada pembahasan tips dan trik seputar dunia website.Pada kesempatan kali ini saya akan memberikan tips tentang Belajar CRUD Dengan PHP dan Ajax Part 1, pada tahap ini kita akan menyiapkan layoutnya terlebih dahulu kemudian kita buat atau siapkan databasenya dan kita juga akan menginstall ajax nya. Untuk itu teman – teman yang saat ini sedang mencari refrensi belajar tentang oop dan ajax, tidak ada salahnya artikel saya ini menjadi bahan belajar untuk teman – teman.
Baik, langsung saja kita implementasikan Belajar CRUD Dengan PHP dan Ajax Part 1 teman – teman siapkan text editornya kemudian ketikkan script html nya di bawah ini untuk membuat sebuah layout form input dengan bootstrap 4. Masukkan library bootstrap 4 nya
|
1 2 3 4 |
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"></script> |
Kemudian masukkan html nya di bawah ini
|
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 |
<div class="container"> <div class="row"> <div class="col-md-8"> <h2>Belajar CRUD Dengan OOP PHP dan Ajax</h2> <form action=""> <div class="form-group"> <label for="nama">Nama:</label> <input type="text" class="form-control" id="nama" placeholder="Masukkan Nama" name="nama"> </div> <div class="form-group"> <label for="usia">Usia:</label> <input type="text" class="form-control" id="usia" placeholder="Masukkan Usia" name="usia"> </div> <div class="form-group"> <label for="email">Email:</label> <input type="text" class="form-control" id="email" placeholder="Masukkan Email" name="email"> </div> <div class="form-group"> <label for="tlp">Telepon:</label> <input type="text" class="form-control" id="tlp" placeholder="Masukkan Telepon" name="tlp"> </div> <div class="form-group"> <label for="alamat">Alamat:</label> <input type="text" class="form-control" id="alamat" placeholder="Masukkan Alamat" name="alamat"> </div> <div class="form-group"> <label for="studi">Studi:</label> <input type="text" class="form-control" id="studi" placeholder="Masukkan Studi" name="studi"> </div> <button type="submit" class="btn btn-primary">Input Data</button> </form> </div> <div class="col-md-4"> </div> </div> </div> |
Save dengan nama index.php, dan buka pada browsernya. Maka akan tampil seperti gambar di bawah ini
Kemudian kita buat database pada mySql nya, dengan nama data_murid sebagai database dan nama profil_murid sebagai table nya
Kemudian isikan table nya seperti di bawah ini
Pada tahap ini sudah selesai, ajax juga sudah kita install pada library di atas
Kita akan lanjutnkan pada artikel selanjutnya yaitu input data kedalam database dengan ajax dan oop, sekian pada artikel kali ini tentang Belajar CRUD Dengan PHP dan Ajax Part 1 semoga bermanfaat. Terimakasih dan sampai jumpa.