--> Skip to main content

PHP Form : Menampilkan Hasil Post Action Pada Halaman Yang Sama


Tutorial dasar-dasar PHP Form kali ini akan membahas bagaimana cara membuat program php form action pada halaman yang sama, tidak perlu redirect atau memanggil halaman lainnya.

Pada pembelajaran PHP Form sebelumnya, ketika kita membuat form kemudian setelah method="post" kita menggunakan action="namafile.php" untuk melewatkan data yang dinputkan di form  ke halaman "namafile.php".

Nah kali ini, kita tidak akan memanggil halaman lainnya di saat melewatkan data yang kita inputkan pada form inputan. Data-data yang telah diinputkan akan ditampilkan pada halaman yang sama.

Dalam percobaan kali ini, kita akan melakukan dua percobaan :
  • Percobaan ke-1, proses pengiriman data akan dilewat antar halaman. Dalam kasus ini, setelah dimasukkan data pada form inputan, lalu akan dipanggil file halaman lainnya untuk diproses dan ditampilkan hasilnya.
  • Percobaan ke-2, proses pengiriman data akan dilakukan di halaman yang sama. Dalam kasus ini, data yang telah diinputkan akan diproses dan ditampilkan pada halaman yang sama (tidak perlu memanggil halaman lainnya).

PERCOBAAN KE-1

Percobaan ke-1 bertujuan untuk menunjukkan proses pengirimana data antar halaman. Oleh karena itu, dalam percobaan ini terdapat dua file:
  • File dataform.php, merupakan halaman untuk inputan user
  • File proses.php, merupakan halaman yang memproses inputan yang telah diinput pada file dataform.php
Semua file disimpan dalam folder phpschool/formaction.

Langkah 1.1

Salin kode program php dibawah ini dan berinama dataform.php, lalu simpan di folder phpschool/formaction.
<!DOCTYPE html>
<head>
    <title>Kirim Data Form PHP</title>
</head>
<body>
<form action="proses.php" method="post">
 <table>
  <tr><td>Nama Lengkap </td><td><input type="text" name="nama"></td></tr>
  <tr><td>Alamat </td><td><textarea name="alamat" width="300"></textarea></td></tr>
  <tr><td>Tanggal Lahir</td><td><input type='date' name='tgl_lhr'/></td></tr>  
  <tr><td>Jenis Kelamin</td>
   <td>
    <input type="radio" name="jns_klmin" value="Pria" checked> Pria
    <input type="radio" name="jns_klmin" value="Wanita"> Wanita
   </td>
  </tr>
  <tr><td>Pendidikan</td>
   <td>
    <select name ="pendidikan">
              <option value="SD">SD</option>
                 <option value="SMP">SMP</option>
                 <option value="SMA">SMA</option>
                 <option value="S1">S1</option>
                 <option value="S2">S2</option>
     <option value="S3">S3</option>
          </select>
   </td>
  </tr>
  <tr><td><input type="submit" value="Simpan" name="simpan"></td></tr>
 </table>
</form>
</body>
</html>

Langkah 1.2


Salin kode program berikut dan berinama file proses.php, lalu simpan juga di folder phpschool/formaction.
<?php
if(isset($_POST['simpan'])){
echo '<table>';
echo '<tr><td>'.'Nama Lengkap: '.'</td><td>'.$_POST['nama'].'</td></tr>';
echo '<tr><td>'.'Alamat: '.'</td><td>'.$_POST['alamat'].'</td></tr>';
echo '<tr><td>'.'Tanggal Lahir: '.'</td><td>'.$_POST['tgl_lhr'].'</td></tr>';
echo '<tr><td>'.'Jenis Kelamin: '.'</td><td>'.$_POST['jns_klmin'].'</td></tr>';
echo '<tr><td>'.'Pendidikan: '.'</td><td>'.$_POST['pendidikan'].'</td></tr>';
echo '</table>';
}
?>

Langkah 1.3

Jalankan file dataform.php pada browser, maka akan tampak tampilan form input seperti gambar di bawah ini :

PHP Form : Menampilkan Hasil Post Action Pada Halaman Yang Sama
Ketika selesai menginput data dan kemudian menekan tombol "Simpan", maka akan dipanggil file proses.php. Jadi data-data tersebut dikirim dan diproses oleh halaman yang berbeda. Sehingga kita akan melihat hasil tampilan dari file proses.php seperti gambar di bawah ini :
PHP Form : Menampilkan Hasil Post Action Pada Halaman Yang Sama


Kesimpulan:Dalam percobaan ini kita telah melihat bahwa proses menyimpan dan menampilkan data dilakukan oleh halaman yang berbeda dari halaman inputan.


PERCOBAAN KE-2

Percobaan ke-2 ini adalah kebalikan dari Percobaan ke-1, dimana kita akan mengirim dan memproses data inputan (menyimpan dan menampilkan) di halaman yang sama.

Dengan demikian, ita hanya membutuhkan satu halaman, yaitu file yang kita berinama dataformself.php. File tersebut kita simpan juga dalam folder phpschool/formaction.

Langkah 2.1

Salin kode program php di bawah ini dan berinama dataformself.php :
<?php
// mengdefiniskan variabel dan diset kosong
$name = $address = $date_birth = $gender = $level_edu = "";

if ($_SERVER["REQUEST_METHOD"] == "POST") {
  $name     = $_POST["nama"];
  $address    = $_POST["alamat"];
  $date_birth  = $_POST['tgl_lhr'];
  $gender      = $_POST['jns_klmin'];
  $level_edu   = $_POST['pendidikan'];
}
?>
<!DOCTYPE html>
<head>
    <title>Kirim Data Form PHP</title>
</head>
<body>
<form method="post" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>">
 <table>
  <tr><td>Nama Lengkap </td><td><input type="text" name="nama"></td></tr>
  <tr><td>Alamat </td><td><textarea name="alamat" width="300"></textarea></td></tr>
  <tr><td>Tanggal Lahir</td><td><input type='date' name='tgl_lhr'/></td></tr>  
  <tr><td>Jenis Kelamin</td>
   <td>
    <input type="radio" name="jns_klmin" value="Pria" checked> Pria
    <input type="radio" name="jns_klmin" value="Wanita"> Wanita
   </td>
  </tr>
  <tr><td>Pendidikan</td>
   <td>
    <select name ="pendidikan">
              <option value="SD">SD</option>
                 <option value="SMP">SMP</option>
                 <option value="SMA">SMA</option>
                 <option value="S1">S1</option>
                 <option value="S2">S2</option>
     <option value="S3">S3</option>
          </select>
   </td>
  </tr>
  <tr><td><input type="submit" value="Simpan" name="simpan"></td></tr>
 </table>
</form>
<br/><br/>
<?php
echo '<table>';
echo '<tr><td>'.'Nama Lengkap: '.'</td><td>'.$name.'</td></tr>';
echo '<tr><td>'.'Alamat: '.'</td><td>'.$address.'</td></tr>';
echo '<tr><td>'.'Tanggal Lahir: '.'</td><td>'.$date_birth.'</td></tr>';
echo '<tr><td>'.'Jenis Kelamin: '.'</td><td>'.$gender.'</td></tr>';
echo '<tr><td>'.'Pendidikan: '.'</td><td>'.$level_edu.'</td></tr>';
echo '</table>';
?>
</body>
</html>

Langkah 2.2

Jalankan file dataformself.php tersebut pada browser anda, sehingga kita akan melihat tampilan awal seperti Gambar.A. Kemudian saat kita inputkan data (Gambar.B) lalu ditekan tombol "Simpan", maka data akan dimunculkan pada halaman yang sama seperti yang terlihat pada Gambar. C.
PHP Form : Menampilkan Hasil Post Action Pada Halaman Yang Sama

Jika pada "Percobaan Ke-1" ketika kita tekan tombol "Simpan" akan dipanggil halaman lain, yakni file proses.php. Sedangkan pada "Percobaan Ke-1" ini, halaman tersebut akan memanggil dirinya sendiri ketika ditekan tombol "Simpan".
Comment Policy: Silahkan tuliskan komentar Anda yang sesuai dengan topik postingan halaman ini. Komentar yang berisi tautan tidak akan ditampilkan sebelum disetujui.
Buka Komentar
Tutup Komentar