Header Ads

  • Breaking News

    Input Data Berbasis Web Menggunakan Script Pemrograman PHP Kemudian Data Tersebut Akan Tersimpan Didalam Database MySQL


    Pemrograman WEB II - Membuat suatu form input data berbasis web menggunakan script pemrograman PHP kemudian data tersebut akan tersimpan didalam database MySQL. Sebagai contoh adalah input data mahasiswa yang terdiri dari field / atribut id_mahasiswa (NIM), Nama, Jurusan, Alamat, dan Nomor telepon dengan nama tabel mahasiswa, dan tentunya atribut yang menjadi primary key adalah id_mahasiswa.

    Tutorial membuat form input data dengan PHP dan MySQL dilengkapi dengan beberapa script validasi data ini, kami lakukan pada sistem operasi Windows 7 dan menggunakan web server XAMPP ver 3.2.1 include dengan database MySQL. Untuk mengikuti tutorial ini pastikan komputer anda telah completed install web server XAMPP tersebut.

    Berikut langkah - langkah cara membuat form input data dengan PHP dan MySQL, lengkap dengan script validasi data sebelum data benar-benar tersimpan ke database.

    1. Aktifkan XAMPP control panel
    2. Buka panel database MySQLi
    3. Membuat database
    4. Desain form input data php
    5. Create file action input data dengan php.
    1. Jalankan XAMPP Control Panel, kemudian aktifkan Apache dan MySQL.


    2. Akses ke database MySQL melalui browser dengan url : http://localhost/phpmyadmin/

    3. Buat database dengan nama sesuai keinginan anda kemudian buat sebuah table dengan nama "mahasiswa" dengan field seperti pada gambar dibawah ini:


    4. Desain / buat form input data PHP. Tampilannya seperti berikut:


    Untuk membuat form input data yang dapat diakses melalui web browser seperti gambar diatas, tulis script PHP berikut pada text editor (notepad):

    1. <html>
    2. <head>
    3. <title>Download Script Form Input Data | PHP MySQL Tutorial</title>
    4. <style type="text/css" media="screen">
    5. table {font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 11px;}
    6. input {font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 11px;height: 20px;}
    7. </style>
    8. </head>
    9. <body>
    10. <div style="border:0; padding:10px; width:760px; height:auto;">
    11. <form action="action-input-data.php" method="POST" name="form-input-data">
    12. <table width="760" border="0" align="center" cellpadding="0" cellspacing="0">
    13. <tr height="46">
    14. <td width="10%"> </td>
    15. <td width="25%"> </td>
    16. <td width="65%"><font color="orange" size="2">Form Input Data Mahasiswa</font></td>
    17. </tr>
    18. <tr height="46">
    19. <td> </td>
    20. <td>ID Mahasiswa / NIM</td>
    21. <td><input type="text" name="id_mahasiswa" size="35" maxlength="6" /></td>
    22. </tr>
    23. <tr height="46">
    24. <td> </td>
    25. <td>Nama</td>
    26. <td><input type="text" name="nama" size="50" maxlength="30" /></td>
    27. </tr>
    28. <tr height="46">
    29. <td> </td>
    30. <td>Jurusan</td>
    31. <td><select name="jurusan">
    32. <option value="-">- Pilih Jurusan -
    33. <option value="Teknik Komputer">Teknik Komputer
    34. <option value="Teknik Informatika">Teknik Informatika
    35. <option value="Teknik Mesin">Teknik Mesin
    36. <option value="Teknik Elektro">Teknik Elektro
    37. <option value="Komputer Akuntansi">Komputer Akuntansi
    38. </select></td>
    39. </tr>
    40. <tr height="46">
    41. <td> </td>
    42. <td>Alamat</td>
    43. <td><input type="text" name="alamat" size="50" maxlength="30" /></td>
    44. </tr>
    45. <tr height="46">
    46. <td> </td>
    47. <td>No. Telp</td>
    48. <td><input type="text" name="telepon" size="20" maxlength="12" /></td>
    49. </tr>
    50. <tr height="46">
    51. <td> </td>
    52. <td> </td>
    53. <td><input type="submit" name="Submit" value="Submit">   
    54. <input type="reset" name="reset" value="Cancel"></td>
    55. </tr>
    56. </table>
    57. </form>
    58. </div>
    59. </body>
    60. </html>

    5. Bentuk file php dengan nama "action-input-data.php", fungsinya adalah sebagai form action yang didefinisikan oleh script pada form input data.

    1. <?php
    2. //cek button
    3. if ($_POST['Submit'] == "Submit") {
    4. $id_mahasiswa = $_POST['id_mahasiswa'];
    5. $nama = $_POST['nama'];
    6. $jurusan = $_POST['jurusan'];
    7. $alamat = $_POST['alamat'];
    8. $telepon = $_POST['telepon'];
    9. //validasi data data kosong
    10. if (empty($_POST['id_mahasiswa'])||empty($_POST['nama'])||empty($_POST['alamat'])||empty($_POST['telepon'])) {
    11. ?>
    12. <script language="JavaScript">
    13. alert('Data Harap Dilengkapi!');
    14. document.location='download-script-form-input-data.php';
    15. </script>
    16. <?php
    17. }
    18. else {
    19. include "../../koneksi-tutor.php";
    20. //cek NIM di database
    21. $cek=mysql_num_rows (mysql_query("SELECT id_mahasiswa FROM mahasiswa WHERE id_mahasiswa='$_POST[id_mahasiswa]'"));
    22. if ($cek > 0) {
    23. ?>
    24. <script language="JavaScript">
    25. alert('NIM sudah dipakai!, silahkan ganti NIM yang lain');
    26. document.location='download-script-form-input-data.php';
    27. </script>
    28. <?php
    29. }
    30. //Masukan data ke Table
    31. $input ="INSERT INTO mahasiswa (id_mahasiswa,nama,jurusan,alamat,telepon) VALUES ('$id_mahasiswa','$nama','$jurusan','$alamat','$telepon')";
    32. $query_input =mysql_query($input);
    33. if ($query_input) {
    34. //Jika Sukses
    35. ?>
    36. <script language="JavaScript">
    37. alert('Input Data Mahasiswa Berhasil');
    38. document.location='download-script-form-input-data.php';
    39. </script>
    40. <?php
    41. }
    42. else {
    43. //Jika Gagal
    44. echo "Input Data Mahasiswa Gagal!, Silahkan diulangi!";
    45. }
    46. //Tutup koneksi engine MySQL
    47. mysql_close($Open);
    48. }
    49. }
    50. ?>

    Script diatas tidak sekedar perintah atau instruksi input data saja, pada script tersebut juga terdapat perintah untuk melakukan validasi jida terdapat kolom yang tidak terisi (kosong). Jadi, jika data tidak lengkap maka perintah atau instruksi input data tidak dapat dijalankan sehingga proses input data tidak akan berhasil.

    Tidak ada komentar

    Post Bottom Ad