21 Des 2009

Teknik Proses Edit Data Dengan Berbagai Komponen Form

RIFAI said :




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

Baca input dari form



<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


Edit Data




// 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.

IN THE NAME ALLOH MOST GRACIOUS AND MOST MERCIFUL

  • segala puji bagi ALLOH tuhan semesta alam