-->
Home
html
php

Menampilkan Hasil Input Form Html Dengan Php

menampilkan hasil input php


Program meng-input dan menampilkan nama, npm, dan kelas mahasiswa menggunakan Php & Html - Pada kesempatan kali ini saya ingin mencoba membuat/memberikan tutorial menampilkan hasil input dengan php. 

Membuat form untuk menginputkan nama, npm, kelas dengan html.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <form method="post">
            <label>Nama</label><br>
            <input type="text" name="nama" placeholder="masukan nama anda" required><br><br>
            <label>Kelas</label><br>
            <input type="text" name="kelas" placeholder="masukan kelas anda" required><br><br>
            <label>NPM</label><br>
            <input type="text" name="npm" placeholder="masukan npm anda" required><br><br>
            <button type="submit" name="tampil">Tampil</button><br>
        </div>
    </form> 
</body>
</html>
Pada code html diatas terdapat element form yang didalamnya terdapat method post yang akan dikirimkan pada halaman tersebut dan disetiap element inputnya memiliki atribut name yang akan diambil dan digunakan untuk membuat variabel penampung isi dari yang diinputkan oleh user.

Code Php

<?php
    if(isset($_POST['tampil']))
    {
        $nama = $_POST['nama'];
        $kelas = $_POST['kelas'];
        $npm = $_POST['npm'];

        echo"<ul>";
        echo"<li> Nama: $nama</li>
            <li> Kelas: $kelas</li>
            <li> NPM: $npm </li>
            ";
        echo"</ul>";
    }
 ?>

Pada code php diatas dimana if(isset($_POST['tampil'] yang berarti jika tombol yang beratribut name='tampil' di klik akan menampilkan perintah dibawahnya. Diketahui didalam perintah di atas memiliki variabel nama, kelas, dan npm yang memiliki value yang diambil dari method post pada elemt html di atas, lalu akan di print sesuai dengan isi value yang di inputkan dengan perintah echo.

Full Source Code


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <form method="post">
            <label>Nama</label><br>
            <input type="text" name="nama" placeholder="masukan nama anda" required><br><br>
            <label>Kelas</label><br>
            <input type="text" name="kelas" placeholder="masukan kelas anda" required><br><br>
            <label>NPM</label><br>
            <input type="text" name="npm" placeholder="masukan npm anda" required><br><br>
            <button type="submit" name="tampil">Tampil</button><br>
        </div>
    </form> 
    <?php
    if(isset($_POST['tampil']))
    {
        $nama = $_POST['nama'];
        $kelas = $_POST['kelas'];
        $npm = $_POST['npm'];

        echo"<ul>";
        echo"<li> Nama: $nama</li>
            <li> Kelas: $kelas</li>
            <li> NPM: $npm </li>
            ";
        echo"</ul>";
    }
    ?>
</body>
</html>

Output Dari Program Diatas



Post a Comment