Penawaran Engine Reservasi Tiket Pesawat

Free Ebook Tutorial from Rosihan Ari's Blog

Tutorial Javascript | Tutorial PHP | Tutorial AJAX | Tutorial CSS | Tutorial FPDF | Tutorial Wordpress | Tutorial Java SE


Ebook yang direkomendasikan untuk Anda
Ebook Panduan Praktis OOP di PHP


Teknik Proses Edit Data Dengan Berbagai Komponen Form


August 5th, 2009 | by rosihanari | Cetak Artikel Cetak Artikel


Jual kaos

Seringkali saya ditanyai oleh rekan-rekan mahasiswa maupun pengunjung setia blog ini tentang bagaimana cara edit data dengan komponen combobox, checkbox, radiobutton dll. Daripada saya menjawabnya satu-persatu, mending saya jadiin satu saja jawabannya melalui artikel ini :-)

Untuk menjawab pertanyaan di atas, di sini saya akan mengimplementasikannya ke dalam sebuah studi kasus yaitu terkait dengan data personal seseorang.

OK.. andaikan kita ingin membuat script untuk pendataan personal seseorang yang terdiri dari: nama, alamat, pekerjaan, jenis kelamin, dan status pernikahan. Dari kebutuhan tersebut, maka kita buat dulu struktur tabel di MySQL sebagai berikut

CREATE TABLE pendataan (
  id int(20) auto_increment,
  nama varchar(30),
  alamat text,
  pekerjaan varchar(30),
  sex varchar(1),
  statusNikah int(11),
  PRIMARY KEY(id)
);

Sebelum kita lanjutkan membuat scriptnya, kita bahas dulu fungsi masing-masing field. Field ‘id’ digunakan untuk menyimpan nomor ID unik setiap orang yang didata. Nomor ini digenerate secara autoincrement. Field ‘nama’, ‘alamat’ saya kira sudah jelas. Untuk field ‘pekerjaan’ ini nanti akan diisi melalui pilihan dari sebuah combo box yang menampilkan beberapa jenis pekerjaan. Oya untuk ‘nama’ nantinya menggunakan textfield atau textbox, sedangkan ‘alamat’ menggunakan textarea. Field ‘sex’ atau jenis kelamin nantinya diisi melalui komponen radiobutton. Nilai field ini berupa ‘L’ (laki-laki) atau ‘P’ (perempuan). Terakhir… field ‘statusNikah’ ini nanti juga akan diisi dengan angka 0 atau 1 (0 = blm menikah, 1 = sudah menikah). Status menikah ini nanti akan diisi melalui sebuah komponen checkbox.

Nah.. andaikan kita memiliki form input seperti di bawah ini:

form.html

<h1>Baca input dari form</h1>

<form method="post" action="insert.php">
<table>
  <tr><td>Nama Anda</td><td>:</td><td><input type="text" name="nama"></td></tr>
  <tr><td>Alamat</td><td>:</td><td><textarea name="alamat" rows="10" cols="20"></textarea></td></tr>
  <tr><td>Jenis Kelamin</td><td>:</td><td><input type="radio" name="sex" value="L">Laki-laki <input type="radio" name="sex" value="P">Perempuan </td></tr>
  <tr>
       <td>Pilih Pekerjaan</td>
       <td>:</td>
       <td>
       <select name="pekerjaan">
         <option value="Petani">Petani</option>
         <option value="Guru">Guru</option>
         <option value="Dokter">Dokter</option>
         <option value="Lain-lain">Lain-lain</option>
       </select>
       </td>
  </tr>
  <tr><td>Status Menikah</td><td>:</td><td><input type="checkbox" name="statusNikah" value="1"> Ya</td></tr>
</table>
<input type="submit" name="submit" value="Submit"><input type="reset" name="reset" value="Hapus">
</form>

Untuk membuat script insertnya ke mysql bisa Anda buat sendiri bukan?

Nah selanjutnya bagaimana dengan script editnya? Pada prinsipnya script edit berisi form, namun bukan blank form namun sudah terisi dengan data yang telah diinputkan. Biasanya form untuk edit ini sama dengan form ketika input data.

Permasalahan utama dalam proses edit adalah cara menampilkan data menggunakan komponen-komponen input pada form. Sebagai contoh misalkan bila ada data dimana jenis kelaminnya laki-laki, maka ketika proses edit via form menunjukkan radiobutton jenis kelaminnya nya telah dipilih laki-laki, begitu pula untuk jenis pekerjaan pada komponen combo boxnya.

Bagaimana cara membuat hal yang demikian? Konsepnya adalah dengan menggunakan IF. Sebagai contoh untuk jenis kelamin. Dalam script edit nantinya akan dicek dulu apakah nilai jenis kelamin yang telah tersimpan laki-laki (L) atau perempuan (P). Jika nilainya ‘L’ maka radiobutton untuk laki-laki akan diberi label ‘checked’ yang artinya terpilih. Sedangkan jika ‘P’ maka label ‘checked’ akan diberikan pada radiobutton perempuan. Hal yang sama juga berlaku untuk komponen yang lain.

Berikut ini script untuk form editnya, yang sama dengan form insertnya.

edit.php

<h1>Edit Data</h1>

<?php

// koneksi ke mysql

mysql_connect("localhost", "root", "rahasiappob");
mysql_select_db("data");

// membaca data id data yang akan diedit (bisa juga menggunakan POST)
$id = $_GET['id'];

// membaca data dalam database sesuai id datanya
$query = "SELECT * FROM pendataan WHERE id = $id";
$hasil = mysql_query($query);
$data  = mysql_fetch_array($hasil);

?>

<form method="post" action="update.php">
<table>
  <tr><td>Nama Anda</td><td>:</td><td><input type="text" name="nama" value="<?php echo $data['nama'];?>"></td></tr>
  <tr><td>Alamat</td><td>:</td><td><textarea name="alamat" rows="10" cols="20"><?php echo $data['alamat'];?></textarea></td></tr>
  <tr><td>Jenis Kelamin</td><td>:</td><td>

  <?php
  // proses pengecekan jenis kelamin
  // jika jenis kelamin dalam databasenya 'L', maka label 'checked' diberikan pada radiobutton yang laki-laki
  // demikian pula jika 'P' (perempuan)

  if ($data['sex'] == "L") echo "<input type='radio' name='sex' value='L' checked>Laki-laki <input type='radio' name='sex' value='P'>Perempuan";
  else if ($data['sex'] == "P") echo "<input type='radio' name='sex' value='L'>Laki-laki <input type='radio' name='sex' value='P' checked>Perempuan";
  ?>

   </td></tr>
  <tr>
       <td>Pilih Pekerjaan</td>
       <td>:</td>
       <td>
       <select name="pekerjaan">

           <?php
           // proses menampilkan pilihan jenis pekerjaan.
           // jika pekerjaan = petani, maka pada option 'petani' diberi label 'selected', demikian seterusnya

           if ($data['pekerjaan'] == "Petani") echo "<option value='Petani' selected>Petani</option>";
           else echo "<option value='Petani'>Petani</option>";

           if ($data['pekerjaan'] == "Guru") echo "<option value='Guru' selected>Guru</option>";
           else echo "<option value='Guru'>Guru</option>";

           if ($data['pekerjaan'] == "Dokter") echo "<option value='Dokter' selected>Dokter</option>";
           else echo "<option value='Dokter'>Dokter</option>";

           if ($data['pekerjaan'] == "Lain-lain") echo "<option value='Lain-lain' selected>Lain-lain</option>";
           else echo "<option value='Petani'>Lain-lain</option>";
           ?>

       </select>
       </td>
  </tr>
  <tr><td>Status Menikah</td><td>:</td><td>

      <?php
      // proses untuk menampilkan pilihan status nikah
      // jika status nikahnya sudah menikah (bernilai 1), maka label 'checked' diberikan ke checkbox nya
      // sedangkan jika tidak, maka label 'checked' tidak dituliskan

      if ($data['statusNikah'] == 1) echo "<input type='checkbox' name='statusNikah' value='1' checked> Ya";
      else echo "<input type='checkbox' name='statusNikah' value='1'> Ya";

      ?>
</td>
  </tr>
</table>
<input type="hidden" name="id" value="<?php echo $data['id']; ?>">
<input type="submit" name="submit" value="Submit"><input type="reset" name="reset" value="Hapus">
</form>

Oya.. jangan lupa untuk menambahkan komponen hidden input untuk menyimpan ID datanya. ID ini nanti akan digunakan untuk proses updatenya. Dalam script di atas, hidden inputnya diletakkan sebelum tombol submit.

Mudah bukan? sekali lagi konsepnya adalah dengan menggunakan IF saja, bukan yang lain.

Script di atas sengaja tidak saya berikan secara lengkap untuk proses insert dan updatenya, supaya Anda bisa melengkapinya sendiri. Anda hanya melengkapi script untuk insert dan updatenya saja, serta interface sebelum proses edit via form di atas. Untuk interface sebelum proses edit, tekniknya Anda bisa menampilkan semua data dalam bentuk list tabel, lalu diberikan link edit ke script edit.php di atas berdasarkan parameter ID datanya (menggunakan GET Method) seperti yang ditunjukkan pada video dalam artikel saya yang lain. Cara lain proses editnya melalui proses pencarian terlebih dahulu, misalkan sebelum mengedit data, user diminta memasukkan ID data yang mau diedit, lalu setelah disubmit muncul form edit.php di atas (menggunakan POST method).




Share ke Facebook Share ke Twitter
Baca Juga Artikel Terkait
Script PHP untuk Edit Data dengan Komponen RadioButton pada Form
Teknik Submit Data Melalui Multi Form
Editing Data Tanggal via Form dengan PHP
Pemrosesan Form dengan Komponen Combo Box
Script PHP untuk Mengedit Data Via Form

Kata kunci: edit data dengan form -


 

Komentar Anda ...