Get dan Post

pt-homina.blogspot.com
by pt-homina.blogspot.com Kamis, Oktober 11, 2018

Assalamualaikum temen temen...

    Yuuuhuuu... Balik lagi bersama mimin yee.. Kali ini kita akan belajar tentang post dan get,mimin gak mau banyak basa basi yak karena mimin ngantuk banget hari ini, abis karena mapel or sama renang yang super duper melelahkan ya gengs. Ini dia pembahasan kali ini:
> Post and get
> Bonuz

Oke kita ke pembahasan yang pertama, yaitu post

1. Post dan Get

Perbedaan POST dan GET

POST
Mempunyai pengertian bahwa metode ini digunakan untuk memparsing hasil inputan form untuk diolah lebih lanjut, tetapi tidak menampilkan query string pada address bar, sehingga lebih aman dibandingkan method GET yang akan terlihat pada address bar. Method POST akan sangat berguna penggunaannya untuk halaman-halaman yang membutuhkan keamanan lebih, karena data inputan kita tidak akan tampil pada address bar browser (disini kelebihan menggunakan Metode POST).

?> Pada contoh file form diatas nilai parsing tidak ditampilkan dalam address bar dan langsung di proses ketempat yang sudah dibuat. Sebenarnya nilai dari parshingan tetap ada tetapi tidak tampak didalam address bar karena valuenya bekerja dibelakang layar (backand). Disinilah keunggulan mengguanakan Method POST.

Perbedaan yang lain dari method POST (Difference of POST Method) adalah:
  • Method POST tidak pernah ter Cache dalam browser
  • Method POST tidak dapat di Bookmark
  • Method POST tidak mempunyai batasan jumlah panjang data

Get
    Adalah metode pengiriman data mengguanakan query string atau menampilkan nilainya pada address bar. Jadi semua nilai pada form akan dikirim kesisi server yang kemudian diterima oleh file tertentu dengan ketentuan nilai form tersebut akan tampil didalam address bar browser/URL browser. Untuk suatu keamanan method POST lebih aman dari method GET.

Perbedaan yang lain dari method GET (Difference of GET Method) adalah:
  • Method GET dapat di cache dalam browser
  • Method GET dapat di bookmark
  • Method GET mempunyai batasan jumlah panjang data yaitu maksimal 2048 karakter

Nah untuk lebih jelasnya bisa dilihat di bawah ini

<!DOCTYPE html>
<html>
<head>
<title>Belajar input</title>
<link rel="stylesheet" href="ini.css">
</head>
<body>
<center>
<form id="biodata" method="post" action="proses.php">
<p>Nama : <br><input type="text" name="nama" id="nama" size="20"></p>
<p>Alamat : <br><textarea name="alamat" cols="30" rows="3" id="alamat"></textarea></p>
<p><input type="submit" name="button" id="button" value="Kirim"></p>
</form>
</body>
</center>
</html>

Untuk prosesnya:
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" href="ini.css">
</head>
<body>
<center>
<form id="biodata">
<?php
$nama = $_POST['nama'];
$alamat = $_POST['alamat'];

echo $nama . '<br>';
echo $alamat . '<br>';
  ?>
</form>
</center>
</body>
</html>

Ini dia tampilannya:

2. Bonuz

Disini mimin membuat karya sendiri nich nih diliat dulu aja sok:

Nah ini dia kodingannya

<!DOCTYPE html>
<html>
<head>
<title>Form Kreasi</title>
<link rel="stylesheet" href="kreasi.css">
</head>
<body>
<center>
<form id="registrasi" method="post" action="registrasi2.php">
<fieldset>
<legend>Yuk Registrasi</legend>
    <img src="bahan/avatar.jpg" alt="Avatar" class="avatar">
  <div class="container">
    <input type="text" name="nama" placeholder="Nama Depan" required><br>
    <input type="text" name="namabelakang" placeholder="Nama Belakang" required><br>
    <input type="text" name="alamat" placeholder="Alamat" required><br>
<label for="ultah"><b>Tanggal Lahir</b></label><br>
<input type="date" name="ultah"><br>
<label for="agama"><b>Agama</b></label><br>
<input class="agama" list="agama" name="agama">
<datalist id="agama">
<option value="Islam">
<option value="Khatolik">
<option value="Protestan">
<option value="Hindu">
<option value="Buddha">
<option value="Khonghucu">
</datalist>
<br><b>Jenis Kelamin :</b><br>
<input type="radio" name="radiobutton" value="pria">Pria/Male
<input type="radio" name="radiobutton" value="wanita">Wanita/Female<br>
    <button type="submit">Daftar</button><br>
    <button type="button" class="cancel">Batal</button>
   </form>
  </div>
</fieldset>
</center>
</body>
</html>

Ini untuk css nya:
body {
    font-family: Tw Cen Mt;
    background-image: url(bahan/planet2.jpg);
}

fieldset {
    background-color:white;
    max-width: 500px;
    border-style: solid;
    border-color: green;
    border-radius: 10px;
    opacity: 0.6;
    transition: 1s;
}
fieldset:hover{
    opacity: 1;
}
legend{
    font-size: 35px;
    border-style: solid;
    background-color: #4CAF;
    color: white;
}

input[type=text], input[type=date], input.stat, input.agama {
    border-radius: 40px;
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    display: inline-block;
    border: 1px solid green;
    box-sizing: border-box;
}

button {
    background-color: green;
    color: white;
    padding: 14px 20px;
    margin: 8px 0;
    border: none;
    cursor: pointer;
    width: 100%;
    border-radius: 20px;
}

button:hover {
    opacity: 0.8;
    font-weight: bold;
    background-color: black;
}

.cancel {
    width: 100%;
    padding: 10px 18px;
    background-color: #f44336;
    border-radius: 20px;
}

.imgcontainer {
    text-align: center;
    margin: 24px 0 12px 0;
}

img.avatar {
    width: 30%;
    border-radius: 50%;
    align-content: center;
}
img.avatar:hover{
    zoom:120%;
}
.container {
    padding: 16px;
}

span.psw {
    float: right;
    padding-top: 16px;
}
* {
    box-sizing: border-box;
}
.php{
    font-size: 25px;
    text-align: left;
    width: 400px;
    height: 350px;
    border:2px solid green;
    border-radius: 10px;
    background-color: white;
    padding-left: 20px;
    opacity: 0.6;
    transition: 1s;
}
.php:hover{
    opacity: 1;
    zoom :110%;
    margin: 120px;
}

Untuk prosesnya pake php ini dia:

<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="sweetalert2.min.js"></script>
    <link rel="stylesheet" href="sweetalert2.min.css">
<link rel="stylesheet" href="kreasi.css">
</head>
<body>
<center>
<div class="php">
<h2>Selamat data anda berhasil disimpan!!</h2>
<?php
$nama = $_POST['nama'];
$namabelakang = $_POST['namabelakang'];
$alamat = $_POST['alamat'];
$ultah = $_POST['ultah'];
$agama = $_POST['agama'];
$radiobutton = $_POST['radiobutton'];

echo 'Nama lengkap            :&ensp;'.$nama .'&nbsp;'. $namabelakang. '<br>';
echo 'Alamat anda &ensp;&nbsp;:&ensp;'.$alamat . '<br>';
echo 'Tanggal Lahir     &ensp;:&ensp;'.$ultah . '<br>';
echo 'Agama &emsp;&emsp;&emsp;:&ensp;'.$agama . '<br>';
echo 'Jenis Kelamin     &ensp;:&ensp;'.$radiobutton .'<br>';
 ?>
 <script>
  swal({
  position: 'top-end',
  type: 'success',
  title: 'Data anda berhasil disimpan',
  showConfirmButton: false,
  timer: 2000
})
 </script>
</div>
</center>
</body>
</html>

Nah mungkin itu saja dari mimin monmaaf bila banyak salah karena mimin hanya manusia yakk

Wassalamualaikum

0 Komentar