<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container"> <div class="row"> <h2>Formulir Pendaftaran SMA Kanisius</h2> </div> <form class="form-horizontal"> <fieldset> <!-- Form Name --> <legend>Biodata Calon Siswa</legend> <!-- Nama Calon Siswa--> <div class="form-group"> <label class="col-md-4 control-label" for="nama">Nama Calon Siswa</label> <div class="col-md-6"> <input id="nama" name="nama" placeholder="Nama Lengkap" class="form-control input-md" required="" type="text"> <span class="help-block">Isi dengan nama lengkap sesuai dengan akta kelahiran dan Ijasah</span> </div> </div> <!-- Nama Panggilan --> <div class="form-group"> <label class="col-md-4 control-label" for="panggilan">Nama Panggilan</label> <div class="col-md-6"> <input id="panggilan" name="panggilan" placeholder="Nama Panggilan" class="form-control input-md" type="text"> </div> </div> <!-- Tanggal Lahir--> <div class="form-group"> <label class="col-md-4 control-label" for="tempatlahir">Tempat, Tanggal Lahir</label> <div class="col-md-6"> <input id="tempatlahir" name="tempatlahir" placeholder="Tempat, Tanggal Lahir" class="form-control input-md" required="" type="text"> </div> </div> <!-- Kewarganegaraan dan agama--> <div class="form-group"> <label class="col-md-4 control-label" for="kewarganegaraan">Kewarganegaraan</label> <div class="col-md-2"> <input id="kewarganegaraan" name="kewarganegaraan" placeholder="" class="form-control input-md" type="text"> </div> <label class="col-md-1 control-label" for="kewarganegaraan">Agama</label> <div class="col-md-2"> <select id="Agama" name="Agama" class="form-control"> <option value="0">-- Pilih Agama --</option> <option value="1">Katolik</option> <option value="2">Islam</option> <option value="3">Hindu</option> <option value="4">Buddha</option> <option value="5">Kristen</option> </select> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="nisn">NISN</label> <div class="col-md-6"> <input id="nisn" name="nisn" placeholder="Nomor Induk Siswa Nasional" class="form-control input-md" required="" type="text"> </div> </div> <!-- NPSN --> <div class="form-group"> <label class="col-md-4 control-label" for="npsn">NPSN Asal Sekolah</label> <div class="col-md-3"> <input id="npsn" name="npsn" placeholder="" class="form-control input-md" type="text"> </div> <div class="col-md-3"> <input id="sekolah_asal" name="nama_sekolah" placeholder="Nomor NPSN Sekolah Asal" class="form-control input-md" type="text"> </div> </div> <!--------------------------- Biodata Calon Siswa ------------------------------------------------> <div class="form-group"> <label class="col-md-4 control-label" for="alamat">Alamat Calon Siswa</label> <div class="col-md-6"> <input id="alamat1" name="alamat1" placeholder="" class="form-control input-md" type="text"> </div> </div> <div class="form-group"> <label class="col-md-4 control-label" for="prependedtext"></label> <div class="col-md-2"> <div class="input-group"> <span class="input-group-addon">RT</span> <input id="prependedtext" name="prependedtext" class="form-control" placeholder="00" type="text"> </div> </div> <div class="col-md-2"> <div class="input-group"> <span class="input-group-addon">RW</span> <input id="prependedtext" name="prependedtext" class="form-control" placeholder="00" type="text"> </div> </div> </div> <!-- Kelurahan --> <div class="form-group"> <label class="col-md-4 control-label" for=""></label> <div class="col-md-6"> Kelurahan <input id="" name="" placeholder="" class="form-control input-md" type="text"> </div> </div> <!-- Kecamatan --> <div class="form-group"> <label class="col-md-4 control-label" for=""></label> <div class="col-md-6"> Kecamatan <input id="" name="" placeholder="" class="form-control input-md" type="text"> </div> </div> <!-- Kabupaten --> <div class="form-group"> <label class="col-md-4 control-label" for=""></label> <div class="col-md-6"> Kabupaten/Kota <input id="" name="" placeholder="" class="form-control input-md" type="text"> </div> </div> <!-- Provinsi --> <div class="form-group"> <label class="col-md-4 control-label" for=""></label> <div class="col-md-2"> Provinsi <input id="" name="" placeholder="" class="form-control input-md" type="text"> </div> <div class="col-md-2"> Kode Pos <input id="" name="" placeholder="" class="form-control input-md" type="text"> </div> </div> <!---------------------- Batas Biodata Calon Siswa ------------------------> <!-- Jarak ke Kanisius--> <div class="form-group"> <label class="col-md-4 control-label" for="jarak">Jarak ke Kanisius</label> <div class="col-md-2"> <div class="input-group"> <input id="jarak" name="jarak" class="form-control" placeholder="00" type="text"> <span class="input-group-addon">Kilometer</span> </div> </div> </div> <!--------------------------- Biodata Ayah ------------------------------------------------> <legend>Biodata AYAH</legend> <div class="form-group"> <label class="col-md-4 control-label" for="alamat">Nama Ayah</label> <div class="col-md-6"> <input id="alamat1" name="alamat1" placeholder="" class="form-control input-md" type="text"> </div> </div> <!-- Tanggal Lahir Ayah --> <div class="form-group"> <label class="col-md-4 control-label" for="tempatlahir">Tempat, Tanggal Lahir</label> <div class="col-md-6"> <input id="tempatlahir" name="tempatlahir" placeholder="Tempat, Tanggal Lahir" class="form-control input-md" required="" type="text"> </div> </div> <!-- Alamat Ayah --> <div class="form-group"> <label class="col-md-4 control-label" for="alamat">Alamat</label> <div class="col-md-6"> <input id="alamat2" name="alamat2" placeholder="" class="form-control input-md" type="text"> </div> </div> <div class="form-group"> <label class="col-md-4 control-label" for="prependedtext"></label> <div class="col-md-2"> <div class="input-group"> <span class="input-group-addon">RT</span> <input id="prependedtext" name="prependedtext" class="form-control" placeholder="00" type="text"> </div> </div> <div class="col-md-2"> <div class="input-group"> <span class="input-group-addon">RW</span> <input id="prependedtext" name="prependedtext" class="form-control" placeholder="00" type="text"> </div> </div> </div> <!-- Kelurahan --> <div class="form-group"> <label class="col-md-4 control-label" for=""></label> <div class="col-md-6"> Kelurahan <input id="" name="" placeholder="" class="form-control input-md" type="text"> </div> </div> <!-- Kecamatan --> <div class="form-group"> <label class="col-md-4 control-label" for=""></label> <div class="col-md-6"> Kecamatan <input id="" name="" placeholder="" class="form-control input-md" type="text"> </div> </div> <!-- Kabupaten --> <div class="form-group"> <label class="col-md-4 control-label" for=""></label> <div class="col-md-6"> Kabupaten/Kota <input id="" name="" placeholder="" class="form-control input-md" type="text"> </div> </div> <!-- Provinsi --> <div class="form-group"> <label class="col-md-4 control-label" for=""></label> <div class="col-md-2"> Provinsi <input id="" name="" placeholder="" class="form-control input-md" type="text"> </div> <div class="col-md-2"> Kode Pos <input id="" name="" placeholder="" class="form-control input-md" type="text"> </div> </div> <!---------------------- Batas Biodata Ibu ------------------------> <legend>Biodata IBU</legend> <div class="form-group"> <label class="col-md-4 control-label" for="alamat">Nama Ayah</label> <div class="col-md-6"> <input id="alamat1" name="alamat1" placeholder="" class="form-control input-md" type="text"> </div> </div> <!-- Tanggal Lahir Ayah --> <div class="form-group"> <label class="col-md-4 control-label" for="tempatlahir">Tempat, Tanggal Lahir</label> <div class="col-md-6"> <input id="tempatlahir" name="tempatlahir" placeholder="Tempat, Tanggal Lahir" class="form-control input-md" required="" type="text"> </div> </div> <!-- Alamat Ayah --> <div class="form-group"> <label class="col-md-4 control-label" for="alamat">Alamat</label> <div class="col-md-6"> <input id="alamat2" name="alamat2" placeholder="" class="form-control input-md" type="text"> </div> </div> <div class="form-group"> <label class="col-md-4 control-label" for="prependedtext"></label> <div class="col-md-2"> <div class="input-group"> <span class="input-group-addon">RT</span> <input id="prependedtext" name="prependedtext" class="form-control" placeholder="00" type="text"> </div> </div> <div class="col-md-2"> <div class="input-group"> <span class="input-group-addon">RW</span> <input id="prependedtext" name="prependedtext" class="form-control" placeholder="00" type="text"> </div> </div> </div> <!-- Kelurahan --> <div class="form-group"> <label class="col-md-4 control-label" for=""></label> <div class="col-md-6"> Kelurahan <input id="" name="" placeholder="" class="form-control input-md" type="text"> </div> </div> <!-- Kecamatan --> <div class="form-group"> <label class="col-md-4 control-label" for=""></label> <div class="col-md-6"> Kecamatan <input id="" name="" placeholder="" class="form-control input-md" type="text"> </div> </div> <!-- Kabupaten --> <div class="form-group"> <label class="col-md-4 control-label" for=""></label> <div class="col-md-6"> Kabupaten/Kota <input id="" name="" placeholder="" class="form-control input-md" type="text"> </div> </div> <!-- Provinsi --> <div class="form-group"> <label class="col-md-4 control-label" for=""></label> <div class="col-md-2"> Provinsi <input id="" name="" placeholder="" class="form-control input-md" type="text"> </div> <div class="col-md-2"> Kode Pos <input id="" name="" placeholder="" class="form-control input-md" type="text"> </div> </div> <!---------------------- Batas Biodata IBU ------------------------> <!-- Button Submit --> <div class="form-group"> <label class="col-md-4 control-label" for="submit"></label> <div class="col-md-2"> <button id="submit" name="submit" class="btn btn-primary">Simpan</button> </div> </div> </fieldset> </form> </div>