Welcome to My Blogger : April 2019

Sabtu, 13 April 2019

Pembuatan dan Pemanggilan Form dengan menggunakan Sublime Text 3

Assalamu'alaykum warahmatullahi wabarakatuh

Saya akan memberikan tutorial cara Pembuatan dan Pemanggilan Form dengan menggunakan Sublime Text 3.

Berikut cara Pembuatan Form Input dan Pemanggilan Data dari Form Input :

1. Buka aplikasi XAMPP, lalu klik Start pada 'Apache' dan 'MySQL'.

2. Setelah itu, buka aplikasi Text Editor nya yaitu Sublime Text 3.

3. Setelah itu, untuk memudahkan pengerjaan codingan, simpan terdahulu dengan nama file forminputpegawai.php .

Lalu, ketik "html"

4. Setelah itu, klik Enter. Maka akan muncul seperti ini..

5. Buat codingan script program untuk membuat Form Input seperti ini :

<!DOCTYPE html>

<html>

<head>

<title>Input Formulir Pegawai</title>

</head>

<h1>Formulir Pegawai Negeri Konoha</h1>

<br>

<tr>

<td colspan="4" align="center"><b>Isi Data Dibawah ini :</b>

</tr>

<pre>

<tr>

</tr>

<tr>

<td>Alamat</td>

</tr>

<tr>

<td>Tempat Lahir</td>

</tr>

<tr>

<td> Tanggal Lahir </td>

</tr>

</pre>

<tr>

<td> Jenis Kelamin </td>

<td> : <input type="radio" name="jeniskel" value="Laki-Laki">Laki-Laki

<input type="radio" name="jeniskel" value="Perempuan">Perempuan

</td>

</tr>

<tr>

<td> Pendidikan </td>

<option value="-Pilih-">-Pilih-

<option value="SMA/SMK">SMA/SMK

<option value="D3">D3

<option value="S1">S1

</td>

</tr>

</option>

</select>

</table>

<p>

<tr>

</center>

</tr>

</p>

</body>

</html>

Setelah sudah selesai, Save kembali.

6. Setelah buat codingan form Input nya, lalu buatlah codingan script program untuk Memanggil Data dari Form Input dengan nama file tampilformulir.php .

<!DOCTYPE html>

<html>

<head>

<title>Tampil Formulir</title>

</head>

<?php

$nama=$_POST['Nama'];

$alamat=$_POST['Alamat'];

$tempat=$_POST['Tempat'];

$tanggal=$_POST['Tanggal'];

$jeniskel=$_POST['jeniskel'];

$pendidikan=$_POST['Pendidikan'];

<h1>FORMULIR PEGAWAI NEGERI KONOHA</h1> <center>

<tr>

</tr>

<tr>

<td>Alamat :</td>

</tr>

<tr>

<td>Tempat Lahir :</td>

</tr>

<tr>

<td>Tanggal Lahir :</td>

</tr>

<tr>

<td>Jenis Kelamin :</td>

</tr>

<tr>

<td>Pendidikan :</td>

</tr>

</table>

</body>

</html>

Setelah sudah selesai, Save kembali.

7. Buka salah satu web browser seperti Google Chrome, Mozilla Firefox, Internet Explorer

8. Setelah itu ketik di alamat URL seperti ini :

9. Hasilnya seperti ini :

Form INPUT

Setelah isi input an nya, maka output nya akan muncul seperti ini :

Form OUTPUT

Sekian tutorial cara Pembuatan dan Pemanggilan Form dengan menggunakan Sublime Text 3.

Mohon maaf jika ada kesalahan kata.

Semoga bermanfaat untuk kalian :)

Wassalamu'alaykum warahmatullahi wabarakatuh

Minggu, 07 April 2019

Cara Membuat BUKU TAMU dan DATA KOMENTAR dengan menggunakan Form Input dan Output pada SCRIPT HTML

Assalamu’alaykum warahmatullahi wabarakatuh

Saya akan memberikan tutorial bagaimana cara membuat BUKU TAMU dan DATA KOMENTAR dengan menggunakan Form input dan output pada SCRIPT HTML

Sebelumnya saya akan memberi penjelasan sedikit tentang PENGENALAN FORM

A. Komponen Form

Sebuah website dinamis seringkali memerlukan interaksi antara browser client dan server bisa berupa pemasukan data teks, angka, atau upload file untuk diproses oleh server. Untuk mewadahi suatu data yang dikirimkan oleh browser client, dibutuhkan adanya FORM HTML.

Penggunaan form misalnya untuk pendaftaran keanggotaan, pemasukan kode kartu kredit, login user, transaksi perbelanjaan, dan upload file.

Dalam FORM HTML, terdapat beberapa komponen yang bisa digunakan, antara lain :

B. Pengolahan Data Dari Form

Form di HTML dikenal dengan adanya tag <FORM> dan ditutup dengan tag </FORM>. Di dalam tag pembuka <FORM> diikuti dengan atribut action dan method. Action menjelaskan ke h alaman yang digunakan untuk memproses input, sementara method digunakan untuk mengatur cara mem-parsing konten.

Web menerima input dari user atau pengunjung menggunakan metode GET dan POST. GET akan mengirimkan data bersama dengan URL, sedangkan POST akan mengirimkannya secara terpisah. User mengirimkan data input dengan mengisi teks atau pilihan pada attibut form html.

Berikut cara membuat Form INPUT dan OUTPUT pada SCRIPT HTML

1. Buka aplikasi XAMPP, lalu aktifkan.

2. Dan juga buka aplikasi Editor Teks nya. (disini saya pakai Aplikasi Sublime Text 3)

Untuk download Sublime Text 3 nya silahkan klik DISINI

Dan muncul seperti ini

Sebelum membuat nya, terlebih dahulu buat folder yang terletak di :

Local Disk (C: ) > xampp >htdocs .

Buatlah folder baru bernama “tugas” pada file folder “htdocs”

3. Setelah itu, untuk memudahkan pengerjaan codingan nya, simpan terdahulu dengan nama file forminputkomentar.php

Lalu ketik “<html>”

4. Setelah itu, klik Enter. Maka akan muncul seperti ini.

Mudah kan? Jadi tidak perlu mengetik manual seperti pada aplikasi Notepad atau Notepad++

5. Setelah itu, buatlah codingan Form INPUT seperti ini :

<!DOCTYPE html>

<<!DOCTYPE html>

<html>

<head>

<title>Input Komentar</title>

</head>

<body>

Komentar dan Saran Anda Sangat Kami Butuhkan<br>

Untuk Meningkatkan Kualitas Situs Kami.

<hr>

<pre>

Nama Anda : <input type="text" name="Nama" size="25" maxlength="50">

Email Anda : <input type="text" name="Email" size="25" maxlength="50">

Komentar : <textarea name="Komentar" cols="50" rows="5"></textarea>

</pre>

</form>

</body>

</html>

Setelah sudah selesai, Save kembali.

6. Sesudah buat form input nya. Buatlah form Output nya dengan klik “File” lalu klik “New File”.

Setelah itu, save terlebih dahulu dengan nama File tampilkomentar.php

Lalu, buatlah codingan form OUTPUT seperti ini :

<!DOCTYPE html>

<html>

<head>

<title>Data Komentar</title>

</head>

<body>

<?php

$nama=$_POST['Nama'];

$email=$_POST['Email'];

$komentar=$_POST['Komentar'];

<h1>Data Komentar Anda</h1>

<hr>

Nama Anda : <?php echo $nama; ?> <br>

Email Anda : <?php echo $email; ?> <br>

Komentar : <?php echo $komentar; ?> <br>

<a href="forminputkomentar.php">INPUT DATA LAGI</a>

</body>

</html>

Setelah sudah selesai, Save kembali.

7. Buka salah satu web browser seperti Google Chrome, Mozilla Firefox, Internet Explorer

8. Setelah itu ketik di alamat URL seperti ini

9. Hasilnya seperti ini :

Form INPUT :

Form input nya saya kasih contoh isi seperti ini :

Setelah isi FORM nya, lalu klik “Kirim”

Form OUTPUT :

Setelah isi input an nya, maka output nya akan muncul seperti ini :

Sekian tutorial cara membuat BUKU TAMU dan DATA KOMENTAR

dengan menggunakan Form INPUT dan OUTPUT dengan

menggunakan FORM HTML.

Mohon maaf jika ada kesalahan kata.

Semoga bermanfaat untuk kalian :)

Wassalamu’alaykum warahmatullahi wabarakatuh