Tampilkan postingan dengan label PROGRAMING. Tampilkan semua postingan
Tampilkan postingan dengan label PROGRAMING. Tampilkan semua postingan

Rabu, 11 Desember 2013

Contoh Form Registrasi (Pendaftaran) Mahasiswa Baru dengan HTML


<html>
<head><title>Form Pendaftaran Mahasiswa Baru</title>
</head>
<body>
<center><img src="snmptn.jpg" width=60% height=25%></center>
<table border='0' width='60%' cellpadding='2'  cellspacing='2' align='center' bgcolor=white><tr><br></tr>
    <tr><td colspan="2" bgcolor=Gainsboro><center><b>INFORMASI PERSONAL</b></center></td></tr>
    <tr><td><b>No. Pendaftaran</b></td><td><input type="text" name="no.pndftaran" size="40" maxlength="50"/></td></tr>
    <tr><td><b>Nama</b></td><td><input type="text" name="nama" size="40" maxlength="50"/></td></tr>
    <tr><td><b>Tempat Tanggal Lahir</b></td>
        <td><input type="text" name="TTL" size="30" maxlength="50"/>
        <select name="tgl">
        <option value="pilih">1</option>
        <option value="pilih">2</option>
        <option value="pilih">3</option>
        <option value="pilih">4</option>
        <option value="pilih">5</option>
        <option value="pilih">6</option>
        <option value="pilih">7</option>
        <option value="pilih">8</option>
        <option value="pilih">9</option>
        <option value="pilih">10</option>
        <option value="pilih">11</option>
        <option value="pilih">12</option>
        <option value="pilih">13</option>
        <option value="pilih">14</option>
        <option value="pilih">15</option>
        <option value="pilih">16</option>
        <option value="pilih">17</option>
        <option value="pilih">18</option>
        <option value="pilih">19</option>
        <option value="pilih">20</option>
        <option value="pilih">21</option>
        <option value="pilih">22</option>
        <option value="pilih">23</option>
        <option value="pilih">24</option>
        <option value="pilih">25</option>
        <option value="pilih">26</option>
        <option value="pilih">27</option>
        <option value="pilih">28</option>
        <option value="pilih">29</option>
        <option value="pilih">30</option>
        <option value="pilih">31</option>
        </select>
        <select name="bln">
        <option value="pilih">Januari</option>
        <option value="pilih">Februari</option>
        <option value="pilih">Maret</option>
        <option value="pilih">April</option>
        <option value="pilih">Mei</option>
        <option value="pilih">Juni</option>
        <option value="pilih">Juli</option>
        <option value="pilih">Agustus</option>
        <option value="pilih">September</option>
        <option value="pilih">Oktober</option>
        <option value="pilih">November</option>
        <option value="pilih">Desember</option>
        </select>
        <Select name="thn">
        <option value="pilih">1988</option>
        <option value="pilih">1989</option>
        <option value="pilih">1990</option>
        <option value="pilih">1991</option>
        <option value="pilih">1992</option>
        <option value="pilih">1993</option>
        <option value="pilih">1994</option>
        <option value="pilih">1995</option>
        </select></td>
        </td>
        </tr>
    <tr><td><b>Alamat</b></td><td><textarea name="alamat" cols="30" rows="3"></textarea></td></tr>
    <tr>
    <td><b>Agama</b></td><td>
    <select name="agama">
    <option value="islam">Islam</option>
    <option value="kristen">Kristen</option>
    <option value="hindu">Hindu</option>
    <option value="budha">Budha</option>
    </select>
    </td>
    <tr>
    <tr>
    <td><b>Jenis Kelamin</b></td><td><input type="radio" name="jenis_kelamin" value="pria"/><label for="jenis_kelamin">Pria</label>
    <input type="radio" name="jenis_kelamin" value="wanita"/><label for="jenis_kelamin">Wanita</label></td>
    </tr>
   
    <td><b>Status</b></td><td>
    <select name="status">
    <option value="menikah">Menikah</option>
    <option value="single">Single</option>
    </select>
    </td>
    <tr>
    <td><b>Kewarganegaraan</b></td><td>
    <select name="kewarganegaraan">
    <option value="wni">WNI</option>
    <option value="wna">WNA</option>
    </select>
    </td>
<tr><td><b>Pekerjaan</b></td><td><input type="text" name="pekerjaan" size="40" maxlength="50"/></td></tr>
<tr><td><b>Kelurahan</b></td><td><input type="text" name="kelurahan" size="40" maxlength="50"/></td></tr>
<tr><td><b>Kecamatan</b></td><td><input type="text" name="kecamatan" size="40" maxlength="50"/></td></tr>
<tr><td><b>Kota/Kabupaten</b></td><td><input type="text" name="kota" size="40" maxlength="50"/></td></tr>
<tr><td><b>Provinsi<b></td><td>
<select name="provinsi">
<option value="Pilih Provinsi Anda">Pilih Provinsi Anda</option>
<option value="Bali">Bali</option>
<option value="Bangka Belitung">Bangka Belitung</option>
<option value="Banten">Banten</option>
<option value="Bengkulu">Bengkulu</option>
<option value="Gorontalo">Gorontalo</option>
<option value="Irian Jaya Barat">Irian Jaya Barat</option>
<option value="Jabotabekdecipsawcib">Jabotabekdecipsawcib</option>
<option value="Jambi">Jambi</option>
<option value="Jawa Barat">Jawa Barat</option>
<option value="Jawa Tengah">Jawa Tengah</option>
<option value="Jawa Timur">Jawa Timur</option>
<option value="Kalimantan Barat">Kalimantan Barat</option>
<option value="Kalimantan Selatan">Kalimantan Selatan</option>
<option value="Kalimantan Tengah">Kalimantan Tengah</option>
<option value="Kalimantan Timur">Kalimantan Timur</option>
<option value="Kepulauan Riau">Kepulauan Riau</option>
<option value="Lampung">Lampung</option>
<option value="Lokasi Lain-lain">Lokasi Lain-lain</option>
<option value="Maluku">Maluku</option>
<option value="Maluku Utara">Maluku Utara</option>
<option value="Nangroe Aceh Darussalam">Nangroe Aceh Darussalam</option>
<option value="Nusa Tenggara Barat">Nusa Tenggara Barat</option>
<option value="Nusa Tenggara Timur">Nusa Tenggara Timur</option>
<option value="Papua">Papua</option>
<option value="Riau">Riau</option>
<option value="Sulawesi Barat">Sulawesi Barat</option>
<option value="Sulawesi Selatan">Sulawesi Selatan</option>
<option value="Sulawesi Tengah">Sulawesi Tengah</option>
<option value="Sulawesi Tenggara">Sulawesi Tenggara</option>
<option value="Sulawesi Utara">Sulawesi Utara</option>
<option value="Sumatera Barat">Sumatera Barat</option>
<option value="Sumatera Selatan">Sumatera Selatan</option>
<option value="Sumatera Utara">Sumatera Utara</option>
<option value="Yogyakarta">Yogyakarta</option>
    </select></td></tr>
    <tr><td><b>No Telepon</b></td><td><input type="text" name="telepon" size="40" maxlength="50"/></td></tr>
    <tr><td colspan="2" bgcolor=Gainsboro><center><b>INFORMASI SEKOLAH</b></center></td></tr>
    <tr><td><b>Asal Sekolah<b/></td><td><input type="text" name="asal sekolah" size="40" maxlength="50"/></td></tr>
    <tr><td><b>Jurusan Sekolah<b/></td><td><input type="text" name="jurusan sekolah" size="40" maxlength="50"/></td></tr>
    <tr><td><b>Nilai Ujian Nasional<b/></td><td><input type="text" name="nilai uan" size="10" maxlength="50"/></td></tr>
    <tr><td><b>Tahun Ajaran</b></td><td><select name="tahun_ajaran">
    <option>Pilih Tahun Ajaran</option>
    <option value="2007">2010</option>
    <option value="2008">2011</option>
    <option value="2009">2012</option>
    <option value="2010">2013</option>
    </select></td></tr>
<tr><td colspan="2" bgcolor=Gainsboro><center><b>PILIH PROGRAM STUDI</b></center></td></tr>
<tr><td><b>Program Studi 1</b></td><td><select name="prodi1">
    <option>Pilih Program Studi</option>
    <option value="SI">Sistem Informasi</option>
    <option value="TI">Teknik Informatika</option>
    <option value="mj">Manajemen</option>
    <option value="ilkom">Ilmu Komunikasi</option>
    <option value="dokter">Pendidikan Kedokteran</option>
    <option value="kesmas">Kesehatan Masyarakat</option>
    <option value="hukum">Hukum</option>
    <option value="Farmasi">Farmasi</option>
    <option value="statis">Statistika</option>
    <option value="psikologi">Psikologi</option>
    <option value="inggris">Pendidikan Bahasa Inggris</option>
    <option value="penjas">Pendidikan Jasmani,Kesehatan dan Rekreasi</option>
    <option value="mtk">Pendidikan Matematika</option>
    <option value="sipil">Teknik Sipil</option>
    <option value="sipil">Teknik Pertambangan</option>
    <option value="agbs">Agribisnis</option>
    <option value="agtk">Agroteknologi</option>
    <option value="ternak">Peternakan</option>
    <option value="tani">Teknologi Hasil Pertanian</option>
    <option value="perikanan">Teknologi Hasil Perikanan</option>
    </select></td></tr>
<tr><td><b>Program Studi 2</b></td><td><select name="prodi2">
    <option>Pilih Program Studi</option>
    <option value="SI">Sistem Informasi</option>
    <option value="TI">Teknik Informatika</option>
    <option value="mj">Manajemen</option>
    <option value="ilkom">Ilmu Komunikasi</option>
    <option value="dokter">Pendidikan Kedokteran</option>
    <option value="kesmas">Kesehatan Masyarakat</option>
    <option value="hukum">Hukum</option>
    <option value="Farmasi">Farmasi</option>
    <option value="statis">Statistika</option>
    <option value="psikologi">Psikologi</option>
    <option value="inggris">Pendidikan Bahasa Inggris</option>
    <option value="penjas">Pendidikan Jasmani,Kesehatan dan Rekreasi</option>
    <option value="mtk">Pendidikan Matematika</option>
    <option value="sipil">Teknik Sipil</option>
    <option value="sipil">Teknik Pertambangan</option>
    <option value="agbs">Agribisnis</option>
    <option value="agtk">Agroteknologi</option>
    <option value="ternak">Peternakan</option>
    <option value="tani">Teknologi Hasil Pertanian</option>
    <option value="perikanan">Teknologi Hasil Perikanan</option>
    </select></td></tr>
    <tr>
    <td colspan="2"><br><font color=red>Saya menyatakan bahwa data yang saya isikan diatas sudah benar.
        Saya bersedia menerima sanksi pembatalan penerimaan di PTN yang saya pilih apabila saya melanggar pernyataan ini.<br>
    </td></tr>
<tr><td colspan="2" align="center">
<input type="submit" value="Proses">
<input type="reset" value="Batal">
</table>
</body>
</html>

 Hasil output pada browser kurang lebih seperti dibawah :



Selasa, 10 Desember 2013

Membuat Form Biodata Menggunakan HTML

Berikut ini adalah cara membuat form biodata diri yang disertai foto diri anda.Untuk memulainya anda dapat menggunakan software notepad,notepad++, atau dreamweaver.Kemudian ketik tulisan berikut :

<html>
<head>
<title>Latihan Form</title>
</head>
<body>
<center><h2><b>Biodata Mahasiswa</b></h2></center>
<br>
<table bgcolor="Gainsboro" align="center" border =0 cellpadding="4" cellspacing="4">
    <form name="data" action="latihan1.html" method="get">
    <tr>
        <td width="400">NIM : <input name="nim" size="8" maxlength="13"><br></td>
        <td width="400" rowspan="3" align="center"><img src="photo.jpg" width="100" height="120"></td>
    </tr>
    <tr>
        <td>Nama : <input name="nama" size="40"><br></td>
    </tr>
    <tr>
        <td>Alamat : <br></td>
    </tr>
    <tr>
        <td><textarea rows="5" cols="25">alamat isi disini
        </textarea></td>
        <td>Tanggal Validasi :</td>
    </tr>
    <tr>
        <td>Jenis Kelamin : <br></td>
        <td>
        Tgl <select name="tgl">
        <option value="pilih">1</option>
        <option value="pilih">2</option>
        <option value="pilih">3</option>
        <option value="pilih">4</option>
        <option value="pilih">5</option>
        <option value="pilih">6</option>
        <option value="pilih">7</option>
        <option value="pilih">8</option>
        <option value="pilih">9</option>
        <option value="pilih">10</option>
        <option value="pilih">11</option>
        <option value="pilih">12</option>
        <option value="pilih">13</option>
        <option value="pilih">14</option>
        <option value="pilih">15</option>
        <option value="pilih">16</option>
        <option value="pilih">17</option>
        <option value="pilih">18</option>
        <option value="pilih">19</option>
        <option value="pilih">20</option>
        <option value="pilih">21</option>
        <option value="pilih">22</option>
        <option value="pilih">23</option>
        <option value="pilih">24</option>
        <option value="pilih">25</option>
        <option value="pilih">26</option>
        <option value="pilih">27</option>
        <option value="pilih">28</option>
        <option value="pilih">29</option>
        <option value="pilih">30</option>
        <option value="pilih">31</option>
        </select>
        Bulan <select name="bln">
        <option value="pilih">Januari</option>
        <option value="pilih">Februari</option>
        <option value="pilih">Maret</option>
        <option value="pilih">April</option>
        <option value="pilih">Mei</option>
        <option value="pilih">Juni</option>
        <option value="pilih">Juli</option>
        <option value="pilih">Agustus</option>
        <option value="pilih">September</option>
        <option value="pilih">Oktober</option>
        <option value="pilih">November</option>
        <option value="pilih">Desember</option>
        </select>
        Tahun <Select name="thn"
        <option value="pilih">1989</option>
        <option value="pilih">1990</option>
        <option value="pilih">1991</option>
        <option value="pilih">1992</option>
        <option value="pilih">1993</option>
        </select>
        </td>
    </tr>
    <tr>
        <td><input name="gen" type="radio">
        Laki-laki<br></td>
        <td>Program Studi :</td>
    </tr>
    <tr>
        <td><input name="gen" type="radio" checked>
        Perempuan<br></td>
        <td rowspan="2"><input name="ps" type="checkbox">TI<br>
        <input name="ps" type="checkbox">SI<br>
        <input name="ps" type="checkbox">MI<br>
        </td>
    </tr>
    <tr>
        <td>Kegemaran :<br></td></tr>
    <tr><td><input name="hobi" type="checkbox">Coding<br></td></tr>
    <tr><td><input name="hobi" type="checkbox">Drawing<br></td></tr>
    <tr><td><input name="hobi" type="checkbox">Travel<br></td></tr>
    <tr><td><input name="hobi" type="checkbox">Writing<br></td></tr>
    <tr><td>
Mata Kuliah yang dipilih :
<select name="mata_kuliah">
<option value="pilih">Web Programing</option>
<option value="pilih">Java Applet</option>
<option value="pilih">Visual Programing</option>
<option value="pilih">Pemrograman Pascal</option>
<option value="pilih">Network Programing</option>
</select><br>  
</td></tr>
<tr><td colspan="2" align="center">
<input type="submit" value="Proses">&nbsp&nbsp&nbsp&nbsp&nbsp
<input type="reset" value="Batal">
</form>
</tr></td>
</table>
</body>
</html>

Note : Untuk menambakan foto anda,ganti tulisan "photo.jpg" pada <img src="photo.jpg" width="100" height="120"></td> dengan nama file foto anda dan sesuaikan formatnya agar dapat terbaca dibrowser.

Setelah selesai save file dengan format html.Hasil output yang akan tampil dibrowser seperti dibawah :