Perancangan Aplikasi Ujian Online Berbasis Web
1. beranda.php
<div style="width:80%;margin:0 auto;font-size:110%">
<fieldset style="margin:0 auto;">
<legend>Info Singkat Tentang Aplikasi Dan
Pengembang</legend>
<div>
<p>
Aplikasi ujian online ini sengaja dibuat sesederhana
mungkin dengan tujuan mudah
digunakan oleh semua orang yang peduli terhadap
dunia pendidikan. Fitur utama dalam
aplikasi ini adalah sebagai berikut :</p>
<div class="judul">Untuk semua user :</div>
<ol>
<li>Melihat profil user</li>
<li>Mengganti password karena secara default
password = username / id dari user tersebut</li>
</ol>
<div class="judul">Untuk user admin :</div>
<ol>
<li>Menambah, mengedit dan menghapus mata pelajaran
yang diujikan</li>
<li>Menambah, mengedit dan menghapus daftar
(2)
<li>Menambah, mengedit dan menghapus siswa peserta
ujian</li>
<li>Melihat dan mendownload hasil ujian siswa dalam
bentuk spreadsheet ( excel )</li>
<li>Menghapus nilai siswa pada ujian tertentu, agar
siswa dapat mengulang ujian tersebut</li>
</ol>
<div class="judul">Untuk user siswa :</div>
<ol>
<li>Mengerjakan ujian yang tersedia</li>
<li>Melihat hasil ujian siswa bersangkutan</li>
</ol>
</div>
</fieldset>
</div>
<style>
div.judul{
text-decoration:underline;
font-weight:bolder;
font-size:115%;
}
(3)
2. buat_soal.php
<?php
include_once "include/koneksi.php"; $id_ujian = $_REQUEST["id_ujian"];
$ujian_exe = mysql_query("select nama_ujian,id_mp from ujian where id_ujian='".$id_ujian."'");
while($data = mysql_fetch_assoc($ujian_exe)){ $id_mp = $data['id_mp'];
$nama_ujian = $data['nama_ujian']; }
$soal_terakhir_exe = mysql_query("select id_soal from soal where id_ujian='".$id_ujian."' order by id_soal");
$jum_soal = mysql_num_rows($soal_terakhir_exe); if($jum_soal > 0){
// cari id_soal terakhir $arr_temp = array();
while($data_soal = mysql_fetch_assoc($soal_terakhir_exe)){ $soal_temp = explode("_",$data_soal['id_soal']); $nomer_soal = $soal_temp[1];
array_push($arr_temp,$nomer_soal); }
$soal_terakhir = max($arr_temp); }
(4)
$soal_terakhir = 0; }
?>
<div class="kembali" onclick="kembali_lagi('<?php echo $id_mp ?>')">Kembali</div>
<script type="text/javascript">
function soal_kosong(id_ujian,soal_ke,jum_soal){ var jml_pil_jawaban = 5;
var nama_radio = "_"+id_ujian+"_"+soal_ke; var id_area = "_"+id_ujian+"_"+soal_ke; var soal_kosong = "<div class='soal_ujian'>";
soal_kosong += "<div class='no_soal'>"+jum_soal+"</div>"; soal_kosong += "<div class='isi_soal'>";
soal_kosong += "<div class='div_editor'><span
onclick='hapus_kaji_editor(\""+id_area+"\")'>Preview</span><span onclick='replaceDiv(\""+id_area+"\")'>Text Editor</span></div>";
soal_kosong += "<div class='pertanyaan' id='"+id_area+"'>Tulis pertanyaan disini ...</div>";
soal_kosong += "<div style='clear:both'></div>"; for(var i = 0; i < jml_pil_jawaban;i++){
soal_kosong += "<div class='pilihan_jawaban'><input type='radio' name='"+nama_radio+"' onclick='jawab(this)'/><textarea
(5)
onclick='popup_editor(this)'>Text Editor</label><label onclick='preview(this)'>Preview</label></span></div>";
}
soal_kosong += "<div><span style='text-decoration:underline'>Kunci Jawaban :</span>";
soal_kosong += "<div class='kunci_jawaban'></div>"; soal_kosong += "</div>";
soal_kosong += "<div style='margin:10px'><span class='tombol simpan' onclick='simpan(this)'>Simpan</span><span class='tombol reset'
onclick='reset(this)'>Reset</span></div>"; soal_kosong += "</div></div>";
return soal_kosong; }
function tambah_soal(jumlah){
var jum_awal = "<?php echo $jum_soal ?>";
var soal_terakhir = "<?php echo $soal_terakhir ?>"; for(var i = 0; i < jumlah; i++){
var id_ujian = "<?php echo $id_ujian ?>";
var soal_ke = $(".soal_ujian").length + 1 + parseInt(soal_terakhir); var id_area = "_"+id_ujian+"_"+soal_ke;
var jum_soal_sekarang = $(".soal_ujian").length + 1 + parseInt(jum_awal);
var soalnya = soal_kosong(id_ujian,soal_ke,jum_soal_sekarang); $(soalnya).appendTo("#tempat_soal");
(6)
replaceDiv(id_area); // info untuk jumlah soal
$("#info_jml_soal").text(jum_soal_sekarang); }
}
function jawab(elm){
$(elm).parent().parent().find("div.kunci_jawaban").html($(elm).next().val( ));
}
function hapus_kunci_jawaban(elm){
$(elm).parent().parent().find("div.kunci_jawaban").empty(); }
function simpan(elm){
var isi_soal = $(elm).parents("div.isi_soal");
// pilihan jawaban dan kunci jawaban gak boleh kosong var pilihan_jawaban = new Array();
var error = 0;
$(isi_soal).find(".pilihan_jawaban>textarea").each(function(index){ if($(this).val() == ""){
$(this).css({"background":"#F4C3C2"}); error++;
} else{
(7)
// yang radio buttonnya dipilih berarti jawaban yang benar var temp_status = 0; // 0 = false
if($(this).prev().is(":checked")){ temp_status = 1;
}
var temp_jawaban = [$(this).val(),temp_status]; pilihan_jawaban.push(temp_jawaban);
} });
// ambil pertanyaan tapi destroy dulu ckeditor biar lebih mudah $(isi_soal).find(".div_editor span").eq(0).click();
var pertanyaan = $(isi_soal).find(".pertanyaan").eq(0).html(); var kunci_jawaban = $(isi_soal).find(".kunci_jawaban:first"); // jika sudah lengkap semua simpan ke database
if(error == 0 && $(kunci_jawaban).html() != ""){
// id_ujian diambil dari nama radio button pada pilihan jawaban var nama_radio = $(isi_soal).find(":radio").eq(0).attr("name"); // id untuk div informasi ketika menyimpan soal
var id_info = "info_"+nama_radio; nama_radio = nama_radio.split("_"); var id_ujian = nama_radio['1'];
var id_soal = id_ujian+"_"+nama_radio['2'];
var tinggi_div_soal = $(isi_soal).parent().outerHeight(); var lebar_div_soal = $(isi_soal).parent().outerWidth();
(8)
var posisi = $(isi_soal).parent().position(); var div_overlay = "<div
style='position:absolute;top:"+posisi.top+";left:"+posisi.left; div_overlay
+=";width:"+lebar_div_soal+"px;height:"+tinggi_div_soal+";background:#F FFFFF;opacity:0.6' >";
div_overlay +="</div>";
div_overlay +="<div id='"+id_info+"'
style='position:absolute;border:1px solid #000000;font-weight:bolder"; div_overlay +=";background:#FFFFFF;padding:6px;border:1px solid #00FF00;border-radius:3px;text-align:center' >";
div_overlay +="<span class='loading'>Sedang menyimpan ...</span></div>";
$(div_overlay).appendTo("#tempat_soal");
// letakkan informasi pada div id=id_info tepat ditengah soal var tinggi_info = $("#"+id_info).outerHeight();
var lebar_info = $("#"+id_info).outerWidth();
var atas = (parseInt(posisi.top) + (tinggi_div_soal - tinggi_info)/2)+"px"; var kiri = (lebar_div_soal - lebar_info)/2+"px";
$("#"+id_info).css({"top":atas,"left":kiri}); // simpan soal ke database
var data_kirim = [id_soal,id_ujian,pertanyaan,pilihan_jawaban]; var url = "simpan_soal.php";
(9)
if(hasil == 1){
// info sukses disimpan
$("#"+id_info).html("<span class='sukses'>Sudah disimpan ...</span>");
} else {
// tampilkan info coba simpan lagi
$("#"+id_info).html("<div>Gagal disimpan, mungkin jaringan sedang down ...</div><div style='margin:0
auto;width:80px;border:2px solid green' class='tombol'
onclick=\"simpan_lagi(this,'"+id_info+"')\">Coba lagi</div>"); }
})
} else{
alert("ada yang kosong atau belum memilih jawaban"); if($(kunci_jawaban).html() == ""){
$(kunci_jawaban).css({"background":"#F4C3C2"}); }
} }
function simpan_lagi(elm,info_soal){
(10)
var id_soal = info_soal.substr(5); // hapus overlay
$(elm).parent().parent().remove(); // klik kembali tombol simpan
$("#"+id_soal).parent().find("div input.tombol").eq(0).click(); }
function reset(elm){
var isi_soal = $(elm).parents("div.isi_soal"); $(isi_soal).find("textarea").val("");
$(isi_soal).find(".kunci_jawaban").empty(); }
function preview(elm){
var data_textarea = $(elm).parent().prev().val(); // tutup semua layar monitor
var lebar_layar = $(window).width(); var tinggi_layar = $(document).height();
var overlay = "<div id='overlay' style=\"width:"+lebar_layar+"px;"; overlay +="position:absolute;top:0px;background:#FFFFFF;z- index:25\">";
overlay +="<div style=\"border:1px solid
#000000;width:65%;position:absolute;padding:10px\"><div id='popup_editor'>"+data_textarea+"</div>";
(11)
overlay +="<span class='tombol batal'
onclick='tutup_texteditor(this)'>Tutup</span></div></div></div>"; $(overlay).appendTo("#content");
var atas = (($(window).height() - $("#popup_editor").parent().height()) / 2) + $(window).scrollTop();
var kiri = (lebar_layar - $("#popup_editor").parent().width()) / 2 + $(window).scrollLeft();
$("#popup_editor").parent().css({"top":atas+"px","left":kiri+"px"}); // tinggi overlay disesuaikan
$("#overlay").css({"height":$(document).height()+"px"}); }
function popup_editor(elm){
// tambahkan elemen pemanggil dengan id pemanggil_editor $(elm).attr('id','pemanggil_editor');
var data_textarea = $(elm).parent().prev().val(); // tutup semua layar monitor
var lebar_layar = $(window).width(); var tinggi_layar = $(document).height();
var overlay = "<div id='overlay' style=\"width:"+lebar_layar+"px;"; overlay +="position:absolute;top:0px;background:#FFFFFF;z- index:25\">";
overlay +="<div
style=\"width:65%;position:absolute;padding:10px\"><div id='popup_editor'>"+data_textarea+"</div>";
(12)
overlay +="<div style='margin-top:10px'><span class='tombol edit' onclick='sisipke_textarea(this)'>Sisipkan</span>";
overlay +="<span class='tombol batal'
onclick='tutup_texteditor(this)'>Tutup</span></div></div></div>"; $(overlay).appendTo("#content");
replaceDiv("popup_editor");
var atas = (($(window).height() - $("#popup_editor").parent().height()) / 2) + $(window).scrollTop();
var kiri = (lebar_layar - $("#popup_editor").parent().width()) / 2 + $(window).scrollLeft();
$("#popup_editor").parent().css({"top":atas+"px","left":kiri+"px"}); // tinggi overlay disesuaikan
$("#overlay").css({"height":$(document).height()+"px"}); }
function sisipke_textarea(elm){
hapus_kaji_editor("popup_editor"); var data = $("#popup_editor").html(); // pemanggil editor
var pemanggil = $("#pemanggil_editor"); // textarea yang diisi data
$(pemanggil).parent().prev().val(data).change(); $(elm).parent().parent().parent().remove(); // hapus elemen id dari pemanggil
(13)
}
function tutup_texteditor(elm){
hapus_kaji_editor("popup_editor");
$(elm).parent().parent().parent().remove(); var pemanggil = $("#pemanggil_editor"); $(pemanggil).removeAttr("id");
}
function kembali_lagi(id_mp){
$("#content").html(info_loading).load("daftar_ujian.php?id_mp="+id_mp) ;
}
$(function(){
$("#t_soal").click(); })
</script>
<div id="t_soal" class="tombol tambah" onclick="tambah_soal(1)"> Soal
<span id="info_jml_soal">0</span> </div>
<div id="tempat_soal">
<div style="font-size:140%;font-style:italic;font-weight:bolder" class="tombol">Tambahkan soal untuk ujian <?php echo $nama_ujian ?></div>
(14)
3. buat_ujian.php
<?php
include_once "include/koneksi.php"; $id_mp = $_REQUEST['id_mp'];
$nama_mp = mysql_result(mysql_query("select nama_mp from mapel where id_mp='".$id_mp."'"),0);
?> <div> <fieldset>
<legend>Buat Ujian Baru Mata Pelajaran <?php echo $nama_mp ?></legend>
<div id="stylized" class="select-bar">
<form method="post" title="ujian" onsubmit="return simpan(this)" action="simpan_form.php">
<input type="hidden" name="id_mp" id="id_mp" value="<?php echo $id_mp ?>" class="isian"/>
<label>Nama Ujian
<span class="small">Nama ujian yang dilaksanakan</span> </label>
<input type="text" name="nama_ujian" id="nama_ujian" class="isian"/> <span class="ket"></span>
<label >Tanggal Ujian
<span class="small">Format (2020-12-30)</span> </label>
(15)
<input type="text" name="tanggal" id="tanggal" class="isian" /> <span class="ket"></span>
<label >Waktu Ujian
<span class="small">Dalam menit</span> </label>
<input type="text" name="waktu" id="waktu" class="isian" /> <span class="ket"></span>
<label >Keterangan
<span class="small">Keterangan tambahan</span> </label>
<input type="text" name="keterangan" id="keterangan" class="isian" /> <span class="ket"></span>
<button type="submit" class="isian">Simpan</button> </form>
</div> </fieldset> </div> <script>
function simpan(elm){
var inputan = $(elm).find(".isian");
var data = $(elm).serializeArray(); //berupa JSON object var url = $(elm).attr('action');
var tabel = $(elm).attr('title');
(16)
if($(inputan).eq(i).val() == ""){ $(".ket").eq(i).html("harus diisi").css({"display":"block"});
$(inputan).eq(i).focus(); return false;
} else {
$(".ket").eq(i).empty().css({"display":"none"}); }
} // simpan ke database
$.post(url,{tbl:tabel,data:data},function(hasil){ if(hasil == 1){
var tampil = "<div>Ujian Sudah dibuat</div>"; $("#stylized").html(tampil);
} else{
alert("gagal disimpan"); }
}) return false;
} </script>
(17)
4. cek_ganti_pass.php
<?php
session_start();
include_once "include/koneksi.php"; $id_user = $_SESSION['nis_kj']; $status = 0;
$pass_lama = md5($_REQUEST['pass_lama']); $pass_baru = md5($_REQUEST['pass_baru']); // cek apakah password lama sudah benar
$pass_lama_db = mysql_result(mysql_query("select password from user where id_user='".$id_user."'"),0);
if($pass_lama_db == $pass_lama){
$update_pass = mysql_query("update user set password='".$pass_baru."' where id_user='".$id_user."'");
if($update_pass){ $status = 1; }
} else {
$status = "password lama gak sama, cek kembali ..."; }
echo $status; ?>
(18)
5. daftar_mp.php
<div class="daftar_pelajaran"> <fieldset>
<legend>Pilih Mata Pelajaran</legend> <form id="f_mp">
<input type="text" name="nama_mp" value="nama mata pelajaran"
class="inputan" onfocus="bersihkan(this)" onblur="kembali_semula(this)"/> <span id="simpan_mp" class="tombol tambah"
onclick="simpan_mp(this)">Mata Pelajaran</span> <span id="update_mp" style="display:none">
<span class="tombol simpan" onclick="update_mp(this)">Mata Pelajaran</span>
<span class="tombol batal" onclick="batal_update()">Batal</span> </span>
</form> <?php
// ambil data mata pelajaran dari database
$mp_exe = mysql_query("select * from mapel"); $jml_mp = mysql_num_rows($mp_exe);
if($jml_mp > 0){ ?>
<ul>
<?php
(19)
$jml_ujian = mysql_result(mysql_query("select count(*) from ujian where id_mp='".$data['id_mp']."'"),0);
echo "<div><span class='jml_ujian'>".$jml_ujian."</span>";
echo "<li>".$data['nama_mp']."</li>";
echo "<div onclick=\"lihat_ujian('".$data['id_mp']."')\" style='margin:10px'><span class='tombol tambah'>Ujian </span></div>";
echo "<div onclick=\"edit_mp(this,'".$data['id_mp']."')\" style='margin:10px'><span class='tombol edit'>Pelajaran</span></div>";
echo "<div onclick=\"hapus_mp(this,'".$data['id_mp']."')\" style='margin:10px'><span class='tombol hapus'>Pelajaran</span></div>";
echo "</div>"; }
?> </ul> <?php
} else {
echo "Mata Pelajaran Belum Dibuat"; }
?>
(20)
</div> <script>
function lihat_ujian(id_mp){
// load content dengan data dari daftar_ujian.php
$("#content").html(info_loading).load("daftar_ujian.php?id_mp="+id_mp) ;
}
function edit_mp(elm,id_mp){
var nama_mp = $(elm).parent().find("li").text(); $(".sedang_diedit").removeClass("sedang_diedit"); $(".telah_diedit").removeClass("telah_diedit"); $(elm).parent().addClass("sedang_diedit");
$("#f_mp input[name=nama_mp]").val(nama_mp); // sembunyikan tombol simpan
$("#simpan_mp").fadeOut(); $("#update_mp").fadeIn();
$("#update_mp").data("id_mp",id_mp); }
function batal_update(){
$(".sedang_diedit").removeClass("sedang_diedit"); $("#update_mp").fadeOut();
$("#simpan_mp").fadeIn(); $(".inputan").each(function(){
(21)
}) }
function update_mp(elm){ var errornya = 0;
$(".inputan").each(function(){ if($(this).val() == ""){
errornya++; $(this).focus(); return false; }
})
if(errornya == 0){
//simpan ke database
var data = $(elm).parent().parent().serializeArray(); var url = "update_data.php";
var tabel = "mapel";
data.unshift({"name":"id_mp","value":$("#update_mp").data("id_mp")}); $.post(url,{data:data,table:tabel},function(hasil){
if(hasil == 1){
// update data pada baris yang diedit var div_mapel = $(".sedang_diedit");
(22)
// hapus class sedang diedit dan tambahkan kelas telah diedit
$(div_mapel).removeClass("sedang_diedit").addClass("telah_diedit"); }
else{
alert("gagal disimpan, mungkin data sudah ada \n atau koneksi bermasalah"+hasil);
} }) }
else {
alert("harus diisi semua...."); }
}
function simpan_mp(elm){
var nama_mp = $(elm).prev().val();
if(nama_mp != "" && nama_mp != "nama mata pelajaran"){ //simpan ke database
var data = $(elm).parent().serializeArray(); var url = "simpan_form.php";
var tabel = "mapel";
(23)
if(hasil == 1){
// reload content dengan halaman ini
$("#content").html(info_loading).load("daftar_mp.php"); }
else{
alert("gagal disimpan, mungkin data sudah ada \n atau koneksi bermasalah");
} }) }
else {
alert("harus diisi semua...."); }
}
function hapus_mp(elm,id_mp){
$(".sedang_diedit").removeClass("sedang_diedit"); $(elm).parent().addClass("sedang_diedit");
6. daftar_nilai_mp.php
<div class="daftar_pelajaran"> <fieldset>
<legend>Pilih Mata Pelajaran</legend> <?php
(24)
// ambil data mata pelajaran dari database
$mp_exe = mysql_query("select * from mapel"); $jml_mp = mysql_num_rows($mp_exe);
if($jml_mp > 0){ ?>
<ul>
<?php
while($data = mysql_fetch_assoc($mp_exe)){
$jml_ujian = mysql_result(mysql_query("select count(*) from ujian where id_mp='".$data['id_mp']."'"),0);
echo "<div
onclick=\"lihat_nilai_ujian('".$data['id_mp']."')\"><span
class='jml_ujian'>".$jml_ujian."</span><li>".$data['nama_mp']."</li>"; echo "<div style='margin:10px'><span class='tombol edit'>Lihat Nilai</span></div>";
echo "</div>"; }
?> </ul> <?php
} else {
(25)
} ?>
</fieldset> </div> <script>
function lihat_nilai_ujian(id_mp){
// load content dengan data dari daftar_ujian.php
$("#content").html(info_loading).load("daftar_nilai_ujian.php?id_mp="+i d_mp);
}
</script>
7. daftar_nilai_ujian.php
<?php
// current time
$mtime = microtime();
// split seconds and microseconds $mtime = explode(" ",$mtime); // create a single value for statr time $mtime = $mtime[1] + $mtime[0]; $tstart = $mtime;
include_once "include/koneksi.php"; $id_mp = $_REQUEST['id_mp'];
(26)
$nama_mp = mysql_result(mysql_query("select nama_mp from mapel where id_mp='".$id_mp."'"),0);
?>
<div style="width:80%;margin:0 auto" class="daftar_pelajaran"> <fieldset>
<legend>Daftar Nilai Ujian Mata Pelajaran <?php echo ucwords($nama_mp) ?></legend>
<div style="margin-bottom:10px"><span onclick="download_ini()" class="tombol">Download as xls</span></div>
<?php
echo "<table class='listing' cellpadding='0' cellspacing='0' align='center'>"; //ambil data ujian pada id_mp ini sebagai header
echo "<thead>"; echo "<tr>";
echo "<th>No</th><th>NIS</th><th>Nama</th>"; $sql_head = "select id_ujian,nama_ujian from ujian where id_mp='".$id_mp."'";
$sql_head_exe = mysql_query($sql_head); $head_id_ujian = array();
while($head = mysql_fetch_assoc($sql_head_exe)){ array_push($head_id_ujian,$head['id_ujian']); echo "<th>".$head['nama_ujian']."</th>"; }
(27)
echo "</tr>"; echo "</thead>"; if(count($head_id_ujian) > 0){
// ambil semua data siswa peserta ujian $sql_siswa = "select nis,nama from siswa"; $sql_siswa_exe = mysql_query($sql_siswa); // simpan aja di array dulu biar gampang $data_siswa = array();
while($data = mysql_fetch_assoc($sql_siswa_exe)){ $data_siswa[$data['nis']]['nama'] = $data['nama']; }
8. daftar_nilai_ujian_xls.php
<?php
include_once "include/koneksi.php";
$xlsfile = "Hasil_ujian_".date("d-m-Y").".xls"; header("Content-type: application/vnd.ms-excel");
header("Content-Disposition: attachment; filename=$xlsfile");
$id_mp = $_REQUEST['id_mp'];
$nama_mp = mysql_result(mysql_query("select nama_mp from mapel where id_mp='".$id_mp."'"),0);
?>
(28)
<fieldset>
<legend>Daftar Nilai Ujian Mata Pelajaran <?php echo ucwords($nama_mp) ?></legend>
<?php
echo "<table class='listing' cellpadding='0' cellspacing='0'>"; //ambil data ujian pada id_mp ini sebagai header
echo "<tr>";
echo "<th>No</th><th>NIS</th><th>Nama</th>"; $sql_head = "select id_ujian,nama_ujian from ujian where id_mp='".$id_mp."'";
$sql_head_exe = mysql_query($sql_head); $head_id_ujian = array();
while($head = mysql_fetch_assoc($sql_head_exe)){ array_push($head_id_ujian,$head['id_ujian']); echo "<th>".$head['nama_ujian']."</th>"; }
echo "<th>Rerata</th>"; echo "</tr>";
// ambil semua data siswa peserta ujian $sql_siswa = "select nis,nama from siswa"; $sql_siswa_exe = mysql_query($sql_siswa); // simpan aja di array dulu biar gampang $data_siswa = array();
(29)
$data_siswa[$data['nis']]['nama'] = $data['nama']; }
$sql_nilai = "select id_user,nilai.id_ujian,ifnull(nilai,\"--\") as nilai from nilai right join ujian on ujian.id_ujian=nilai.id_ujian and nilai.id_ujian in (select id_ujian from ujian where id_mp='".$id_mp."') order by
nilai.id_ujian,id_user";
$sql_nilai_exe = mysql_query($sql_nilai);
while($data = mysql_fetch_assoc($sql_nilai_exe)){
$data_siswa[$data['id_user']]['nilai'][$data['id_ujian']] = $data['nilai']; }
// tampilkan dalam tabel $no = 1;
foreach($data_siswa as $id_siswa => $data_tampil){ echo "<tr>";
echo "<td>".$no++."</td>"; echo "<td>".$id_siswa."</td>";
echo "<td>".$data_tampil['nama']."</td>"; $temp_arr = array();
for($i = 0;$i < count($head_id_ujian); $i++){
if(isset($data_tampil['nilai'][$head_id_ujian[$i]])){ $nilainya = $data_tampil['nilai'][$head_id_ujian[$i]]; }
else $nilainya="---";
(30)
array_push($temp_arr,$nilainya); }
echo "<td>".round(array_sum($temp_arr)/count($temp_arr))."</td>";
echo "</tr>"; }
echo "</table>"; ?>
9. daftar_siswa.php
<div style="width:80%;margin:0 auto"> <fieldset style="margin:0 auto">
<legend>Daftar Siswa Peserta Ujian </legend> <form id="f_siswa">
<input type="text" name="nis" value="nomer daftar" class="inputan" onfocus="bersihkan(this)" onblur="kembali_semula(this)"/>
<input type="text" name="nama" value="nama siswa" class="inputan" onfocus="bersihkan(this)" onblur="kembali_semula(this)"/>
<input type="text" name="alamat" value="alamat siswa" class="inputan" onfocus="bersihkan(this)" onblur="kembali_semula(this)"/>
<input type="text" name="agama" value="Islam" class="inputan" onfocus="bersihkan(this)" onblur="kembali_semula(this)"/> <span id="simpan_siswa" class="tombol tambah"
(31)
<span id="update_siswa" style="display:none">
<span class="tombol simpan" onclick="update_siswa(this)">Siswa</span> <span class="tombol batal" onclick="batal_update()">Batal</span>
</span>
<span class='tombol info'></span> </form>
<?php
$sql="select * from siswa"; $sql_exe = mysql_query($sql); if(mysql_num_rows($sql_exe) > 0){
echo "<table class='listing' cellpadding='0' cellspacing='0'>"; // buat headernya kawan
echo "<thead>"; echo "<tr>";
echo "<th>No</th>";
$jum_kolom = mysql_num_fields($sql_exe); for($i = 0; $i < $jum_kolom; $i++){
echo "<th>".mysql_field_name($sql_exe,$i)."</th>"; }
echo "<th>Aksi</th>"; echo "</tr>";
echo "</thead>"; echo "<tbody>"; $no = 1;
(32)
while($data_baris = mysql_fetch_assoc($sql_exe)){ echo "<tr>";
echo "<td>".$no++."</td>"; foreach($data_baris as $data){
echo "<td>".$data."</td>"; }
echo "<td><span class='tombol edit'
onclick='edit_siswa(this)'>Siswa</span> <span class='tombol hapus' onclick='hapus_siswa(this,\"".$data_baris['nis']."\")'>Siswa</span></td>";
echo "</tr>"; }
echo "</tbody>"; echo "</table>";
} else {
echo "Data masih kosong, diisi dulu ya ..."; }
?> </fieldset> </div>
<div class="kembali" onclick="kembali_lagi()">Kembali</div> <script >
function kembali_lagi(){
(33)
}
function simpan_siswa(elm){ var errornya = 0;
$(".inputan").each(function(){ if($(this).val() == ""){
errornya++; $(this).focus(); return false; }
})
if(errornya == 0){
//simpan ke database
var data = $(elm).parent().serializeArray(); var url = "simpan_form.php";
var tabel = "siswa";
$.post(url,{data:data,tbl:tabel},function(hasil){ if(hasil == 1){
// reload content dengan halaman ini
// $("#content").html("").load("daftar_siswa.php"); var jml_baris = $("table.listing tr").length;
var data_baru = "<td>"+jml_baris+"</td>"; $(".inputan").each(function(index){
data_baru +="<td>"+$(this).val()+"</td>"; });
(34)
data_baru +="<td><span class='tombol edit'
onclick='edit_siswa(this)'>Siswa</span> <span class='tombol hapus' onclick='hapus_siswa(this,\""+$(".inputan").eq(0).val()+"\")'>Siswa</span>< /td>";
var baris_baru = "<tr>"+data_baru+"</tr>"; $(baris_baru).insertAfter($("table.listing tr:last")); $(".info").html("sudah disimpan
...").fadeIn('slow').delay("2000").fadeOut(); }
else{
alert("gagal disimpan, mungkin data sudah ada \n atau koneksi bermasalah");
} }) }
else {
alert("harus diisi semua...."); }
}
10. daftar_ujian.php
<div style="margin:0 auto;width:85%"> <fieldset>
(35)
<legend>Daftar Ujian Pada Mata Pelajaran <?php echo $nama_mp ?></legend>
<form id="f_ujian">
<input type="hidden" name="id_mp" id="id_mp" value="<?php echo $id_mp ?>" class="inputan"/>
<input type="text" name="nama_ujian" id="nama_ujian" value="Nama Ujian" class="inputan" onfocus="bersihkan(this)"
onblur="kembali_semula(this)"/>
<input type="text" name="tanggal" id="tanggal" value="Tanggal ujian" class="inputan" onfocus="bersihkan(this)" onblur="kembali_semula(this)"/> <input type="text" name="waktu" id="waktu" value="Waktu (dalam menit)" class="inputan" onfocus="bersihkan(this)" onblur="kembali_semula(this)"/> <input type="text" name="keterangan" id="keterangan" size="60"
value="Keterangan" class="inputan" onfocus="bersihkan(this)" onblur="kembali_semula(this)"/>
<span class="tombol tambah" id="simpan_ujian" onclick="simpan_ujian(this)">Ujian</span> <span id="update_ujian" style="display:none">
<span class="tombol simpan" onclick="update_ujian(this)">Ujian</span> <span class="tombol batal" onclick="batal_update()">Batal</span> </span>
</form>
<div class='daftar_ujian'> <div class='no'>No</div>
(36)
<div class='nama_ujian'>Nama Ujian</div> <div class='tanggal'>Tanggal</div>
<div class='waktu'>Waktu</div> <div class='jml_soal'>Jml_Soal</div> <div class='ket'>Keterangan</div> <div class='aksi'>Aksi</div> </div>
<?php
// tampilkan seluruh ujian pada mata pelajaran ini $sql = "select * from ujian where id_mp ='".$id_mp."'"; $sql_exe = mysql_query($sql);
$no = 1;
while($data = mysql_fetch_assoc($sql_exe)){ echo "<div class='daftar_ujian'>";
echo "<div class='no'>".$no++."</div>";
echo "<div class='nama_ujian'>".$data['nama_ujian']."</div>"; echo "<div class='tanggal'>".$data['tanggal']."</div>";
echo "<div class='waktu'>".$data['waktu']." Menit</div>";
$jml_soal = mysql_result(mysql_query("select count(*) from soal where id_ujian='".$data['id_ujian']."'"),0);
echo "<div class='jml_soal'>".$jml_soal."</div>"; echo "<div class='ket'>".$data['keterangan']."</div>"; echo "<div class='aksi'><span class='tombol edit'
(37)
class='tombol tambah'
onclick='tambah_soal_ujian(\"".$data['id_ujian']."\")'>"; echo "Soal</span><span class='tombol edit'
onclick='edit_soal_ujian(\"".$data['id_ujian']."\")'>Soal</span><span class='tombol hapus'
onclick='hapus_ujian(this,\"".$data['id_ujian']."\")'>Ujian</span></div>"; echo "</div>";
}
?>
</fieldset> </div>
<div class="kembali" onclick="kembali_daftar_mp()">Kembali</div> <script type="text/javascript">
function kembali_daftar_mp(){
$("#content").html(info_loading).load("daftar_mp.php"); }
function tambah_soal_ujian(id_ujian){
$("#content").html(info_loading).load("buat_soal.php?id_ujian="+id_ujia n);
}
function edit_soal_ujian(id_ujian){
$("#content").html(info_loading).load("edit_soal.php?id_ujian="+id_ujian );
(38)
}
function simpan_ujian(elm){ var errornya = 0;
$(".inputan").each(function(){ if($(this).val() == ""){
errornya++; $(this).focus(); return false; }
})
if(errornya == 0){
//simpan ke database
var data = $(elm).parent().serializeArray(); var url = "simpan_form.php";
var tabel = "ujian";
$.post(url,{data:data,tbl:tabel},function(hasil){ if(hasil == 1){
// reload content dengan halaman ini, karena kita butuh id_ujian dari server
$("#content").html(info_loading).load("daftar_ujian.php?id_mp=<?php echo $id_mp; ?>");
} else{
(39)
alert("gagal disimpan, mungkin data sudah ada \n atau koneksi bermasalah");
} }) }
else {
alert("harus diisi semua...."); }
}
function hapus_ujian(elm,id_ujian){
var hapus = confirm("Dengan menghapus ujian ini berarti anda juga akan \n 'Menghapus seluruh data yang berkaitan dengan ujian ini ...'");
if(hapus){
var url = "hapus_data.php";
$.post(url,{id_nilai:id_ujian,id_nama:"id_ujian",table:"ujian"},function(ha sil){
if(hasil == 1){
// hapus dibaris yang dihapus saja kawan $(elm).parent().parent().remove(); //
$("#content").html("").load("daftar_ujian.php?id_mp=<?php echo $id_mp; ?>");
} else {
(40)
alert("gagal dihapus cek query anda ..."); }
}) }
}
function edit_ujian(elm,id_ujian){ var baris = $(elm).parent().parent();
$(baris).parent().find("div.sedang_diedit").removeClass("sedang_diedit"); $(baris).parent().find("div.telah_diedit").removeClass("telah_diedit"); $(baris).addClass("sedang_diedit");
// tampilkan data baris tersebut pada form
var nama_ujian = $(baris).find("div.nama_ujian").text(); var tanggal = $(baris).find("div.tanggal").text();
var waktu = $(baris).find("div.waktu").text(); waktu = waktu.split(" ");
var ket = $(baris).find("div.ket").text(); $("#nama_ujian").val(nama_ujian); $("#tanggal").val(tanggal);
$("#waktu").val(waktu[0]); $("#keterangan").val(ket); $("#simpan_ujian").fadeOut(); $("#update_ujian").fadeIn(); // ambil id_ujian
(41)
}
function batal_update(){
$("div.sedang_diedit").removeClass("sedang_diedit"); $("#update_ujian").fadeOut();
$("#simpan_ujian").fadeIn(); $(".inputan").each(function(){
$(this).val($("#content").data($(this).attr("name"))); })
}
function update_ujian(elm){ var errornya = 0;
$(".inputan").each(function(){ if($(this).val() == ""){
errornya++; $(this).focus(); return false; }
})
11. daftar_ujian_siswa.php
<?php
include_once "include/cek_session.php"; include_once "include/koneksi.php"; $id_mp = $_REQUEST['id_mp'];
(42)
$nama_mp = mysql_result(mysql_query("select nama_mp from mapel where id_mp='".$id_mp."'"),0);
?>
<div style="font-size:80%;width:80%;margin:0 auto;background:#FFFFFF"> <fieldset>
<legend>Daftar Ujian Pada Mata Pelajaran <?php echo $nama_mp ?></legend>
<div class='daftar_ujian'> <div class='no'>No</div>
<div class='nama_ujian'>Nama Ujian</div> <div class='tanggal'>Tanggal</div>
<div class='waktu'>Waktu</div> <div class='ket'>Keterangan</div> <div class='aksi'>Aksi</div> <div class='nilai'>Nilai</div> </div>
<?php
// cek ujian yang sudah dilaksanakan
$sql_nilai = "select id_ujian,nilai from nilai where id_user='".$_SESSION['nis_kj']."'";
$sql_nilai_exe = mysql_query($sql_nilai); if(mysql_num_rows($sql_nilai_exe) > 0){
$nilai = array();
(43)
$nilai[$d_nilai['id_ujian']] = $d_nilai['nilai']; }
}
// tampilkan seluruh ujian pada mata pelajaran ini $sql = "select * from ujian where id_mp ='".$id_mp."'"; $sql_exe = mysql_query($sql);
$no = 1;
while($data = mysql_fetch_assoc($sql_exe)){ echo "<div class='daftar_ujian'>";
echo "<div class='no'>".$no++."</div>";
echo "<div class='nama_ujian'>".$data['nama_ujian']."</div>"; echo "<div class='tanggal'>".$data['tanggal']."</div>";
echo "<div class='waktu'>".$data['waktu']." Menit</div>"; echo "<div class='ket'>".$data['keterangan']."</div>"; // jika suda dikerjakan
if(isset($nilai[$data['id_ujian']])){
echo "<div class='aksi'><span class='tombol view'
onclick='view_jawaban(\"".$data['id_ujian']."\")'>Jawaban</span></div>"; echo "<div class='nilai'>".$nilai[$data['id_ujian']]."</div>";
} else {
echo "<div class='aksi'><span class='tombol edit'
onclick='kerjakan_ujian(\"".$data['id_ujian']."\")'>Kerjakan</span></div>"; echo "<div class='nilai'>Nilainya</div>";
(44)
}
echo "</div>"; }
?>
</fieldset> </div>
<div class="kembali" onclick="kembali_daftar_mp()">Kembali</div> <script>
function kembali_daftar_mp(){
$("#content").html(info_loading).load("mp_siswa.php"); }
function kerjakan_ujian(id_ujian){
$("#content").html(info_loading).load("kerjakan_ujian.php?id_ujian="+id _ujian);
}
function view_jawaban(id_ujian){
$("#content").html(info_loading).load("view_jawaban.php?id_ujian="+id_ ujian);
}
(45)
12. edit_soal.php
include_once "include/koneksi.php"; $id_ujian = $_REQUEST["id_ujian"];
$ujian_exe = mysql_query("select nama_ujian,id_mp from ujian where id_ujian='".$id_ujian."'");
while($data = mysql_fetch_assoc($ujian_exe)){ $id_mp = $data['id_mp'];
$nama_ujian = $data['nama_ujian']; }
$soal_exe = mysql_query("select * from soal where id_ujian='".$id_ujian."' order by id_soal ");
echo "<div id='div_edit_soal'>"; if(mysql_num_rows($soal_exe) > 0){
// ambil semua pilihan jawaban dari database
$sql_jawaban = "select * from pil_jawaban where id_soal in (select id_soal from soal where id_ujian='".$id_ujian."')";
$sql_jawaban_exe = mysql_query($sql_jawaban); $pil_jawaban = array();
while($d_jawaban = mysql_fetch_assoc($sql_jawaban_exe)){
$pil_jawaban[$d_jawaban['id_soal']][$d_jawaban['id_jawaban']]['jawaban' ] = $d_jawaban['jawaban'];
(46)
$pil_jawaban[$d_jawaban['id_soal']][$d_jawaban['id_jawaban']]['status'] = $d_jawaban['status'];
} $no = 1;
echo "<div class='soal_edit'>";
echo "<div class='no_soal'>No</div>";
echo "<div class='isi_soal_edit' style='margin-left:5px'>Soal</div>"; echo "<div class='jawaban_edit'>Pilihan Jawaban</div>";
echo "</div>";
while($data = mysql_fetch_assoc($soal_exe)){ ?>
<div class='soal_edit'>
<div class='no_soal'><?php echo $no++ ?><div style="padding:2px" class="tmb_del" onclick="return
hapus_soal_ini(this)"><img src='image/del.png' title="Hapus soal ini"/></div></div>
<div class='isi_soal_edit'>
<span class='tombol info' style='margin- right:10px;float:right'></span>
<span style='margin-right:10px;float:right'
onclick='edit_soalnya(this)'><img src='image/edit.png' /></span> <span style='margin-right:10px;float:right;display:none' onclick='simpan_soalnya(this)'><img src='image/save.png' /></span>
(47)
<div id="<?php echo $data['id_soal'] ?>" > <?php echo $data['isi_soal'] ?>
</div> </div>
<div class='jawaban_edit'> <?php
foreach($pil_jawaban[$data['id_soal']] as $id_jawaban => $jawaban){
if($jawaban['status'] == '1'){ $terpilih = "jwb_terpilih"; $checked = "checked"; }
else {
$terpilih =""; $checked = ""; }
echo "<div class='div_pil_jawaban $terpilih'><span class='info' style='margin-right:10px;float:right'></span>";
echo "<input disabled type='checkbox' style='float:left' $checked/>";
echo "<span style='position:auto;margin-top:-
1px;float:right' onclick='edit_jawaban(this)'><img src='image/edit.png' /></span>";
(48)
echo "<span style='margin-
right:10px;float:right;display:none' onclick='simpan_jawaban(this)'><img src='image/save.png' /></span>";
echo "<div id='".$id_jawaban."'
class='pil_jawaban'>".$jawaban['jawaban']."</div></div>"; }
?> </div> </div>
<?php } }
else {
echo "soal masih kosong..."; }
echo "</div>"; ?>
<div class="kembali" onclick="kembali_lagi('<?php echo $id_mp ?>')">Kembali</div>
<script type="text/javascript"> function kembali_lagi(id_mp){
$("#content").html("").load("daftar_ujian.php?id_mp="+id_mp); }
(49)
var id_soal = $(elm).next().next().attr("id"); replaceDiv(id_soal);
// sembunyikan tombol ini dan tampilkan tombol sebelahnya $(elm).fadeOut();
$(elm).next().fadeIn(); }
function simpan_soalnya(elm){
var id_soal = $(elm).next().attr("id"); hapus_kaji_editor(id_soal);
var url = "update_data.php"; var tabel = "soal";
var data =
[{"name":"id_soal","value":id_soal},{"name":"isi_soal","value":$("#"+id_so al).html()}];
$(elm).parent().find(".info").html("sedang menyimpan ...").fadeIn(); $.post(url,{data:data,table:tabel},function(hasil){
if(hasil == 1){
// sembunyikan tombol ini dan tampilkan tombol sebelahnya
$(elm).fadeOut(); $(elm).prev().fadeIn();
$(elm).parent().find(".info").html("sudah disimpan ...").delay('3000').fadeOut();
(50)
else {
alert("gagal disimpan...."); }
}) }
function edit_jawaban(elm){
var id_jawaban = $(elm).next().next().attr("id"); replaceDiv(id_jawaban);
// sembunyikan tombol ini dan tampilkan tombol sebelahnya $(elm).fadeOut();
$(elm).next().fadeIn(); }
function simpan_jawaban(elm){
var id_jawaban = $(elm).next().attr("id"); hapus_kaji_editor(id_jawaban);
var url = "update_data.php"; var tabel = "pil_jawaban"; var data =
[{"name":"id_jawaban","value":id_jawaban},{"name":"jawaban","value":$(" #"+id_jawaban).html()}];
$(elm).parent().find(".info").html("sedang menyimpan ...").fadeIn(); $.post(url,{data:data,table:tabel},function(hasil){
(51)
// sembunyikan tombol ini dan tampilkan tombol sebelahnya
$(elm).fadeOut(); $(elm).prev().fadeIn();
$(elm).parent().find(".info").html("sudah disimpan ...").delay('3000').fadeOut();
} else {
alert("gagal disimpan...."); }
}) }
function hapus_soal_ini(elm){
var konfirmasi = confirm("Yakin akan menghapus soal ini ..."); if(konfirmasi){
var id_soal = $(elm).parent().next().find("div").attr("id"); var url = "hapus_data.php";
$.post(url,{id_nilai:id_soal,id_nama:"id_soal",table:"soal"},function(hasil) {
if(hasil == 1){
// hapus dibaris yang dihapus saja kawan $(elm).parent().parent().remove();
(52)
//
$("#content").html("").load("daftar_ujian.php?id_mp=<?php echo $id_mp; ?>");
} else {
alert("gagal dihapus cek query anda ..."); }
}) }
else {
return false; }
} </script>
13. ganti_pass.php
<?php
session_start();
include_once "include/koneksi.php"; ?>
<div style="margin:0 auto;width:50%;padding:10px"> <fieldset>
(53)
<?php
// ambil data mata pelajaran dari database $nis = $_SESSION['nis_kj'];
?>
<div class='div_profil'>
<div class="tombol info"></div>
<div><div class="l_kiri">Password Lama</div><input class='inputan' type='password' name='pass_lama'/></div>
<div><div class="l_kiri">Password Baru</div><input class='inputan' type='password' name='pass_baru'/></div>
<div><div class="l_kiri">Ulangi Password</div><input class='inputan' type='password' name='ulangi_pass'/></div>
<div><div class="l_kiri"> </div><input class='tombol simpan' type='button' value='Ubah Password' onclick='update_pass()'/></div> </div>
</fieldset> </div>
<script type="text/javascript"> function update_pass(){
var errornya = 0; var info="";
$(".inputan").each(function(){ if($(this).val() == ""){
(54)
$(this).focus();
info = "ada yang kosong, harus diisi semua"; return false;
} })
// cek apakah password baru dan ulangi password adalah sama if($("input[name=pass_baru]").val() ==
$("input[name=ulangi_pass]").val()){
} else {
var info = "password baru dan ulangi password tidak sama
..."+$("input[name=pass_baru]").val()+"...."+$("input[name=ulangi_pass]"). val();
errornya++; }
if(errornya == 0){
//simpan ke database
var url = "cek_ganti_pass.php";
$.post(url,{pass_lama:$("input[name=pass_lama]").val(),pass_baru:$("inp ut[name=pass_baru]").val()},function(hasil){
if(hasil == 1){
(55)
$(".info").html("sudah disimpan ...").fadeIn('slow').delay("2000").fadeOut();
} else{
$(".info").html(hasil).fadeIn("slow").delay("2000").fadeOut("slow"); }
}) }
else {
$(".info").html(info).fadeIn("slow").delay("2000").fadeOut("slow"); }
}
14. hal_admin.php
<html> <head>
<link href="image/test.jpg" rel="shortcut icon">
<link href="css/soal.css" rel="stylesheet" type="text/css" /> <link href="css/tabel.css" rel="stylesheet" type="text/css" /> <link href="css/calendar.css" rel="stylesheet" type="text/css" />
(56)
<script type="text/javascript" src="js/jquery-1.5.1.min.js"></script> <script src="js/ckeditor.js"></script>
<script src="js/ckfinder/ckfinder.js"></script> <script src="js/config.js"></script>
<script src="js/ckeditor_fungsi.js"></script> <script src="js/calendar.js"></script>
<script >
var info_loading = "<div style='font-size:110%;font-style:italic;font- weight:bolder;width:150px;margin:0 auto;' class='tombol loading'>Sedang proses ...</div>";
function bersihkan(elm){
$("#content").data($(elm).attr("name"),$(elm).val()); $(elm).val("");
}
function kembali_semula(elm){ if($(elm).val() == ""){
$(elm).val($("#content").data($(elm).attr("name"))); }
}
function load_menu(elm){
$(".menu_terpilih").eq(0).removeClass("menu_terpilih").addClass("menu_ awal");
(57)
$(elm).parent().removeClass("menu_awal").addClass("menu_terpilih"); var url = $(elm).attr("href");
$("#content").html(info_loading).load(url); return false;
}
$(function(){
$(".menu_awal>a").eq(0).click(); })
</script> </head> <body>
<div id="nav_menu">
<ul class="menu_kiri">
<li class="menu_awal"><a onclick="return load_menu(this)" href="beranda.php">Beranda</a></li>
<li class="menu_awal"><a onclick="return load_menu(this)" href="daftar_mp.php">Daftar Ujian</a></li>
<li class="menu_awal"><a onclick="return load_menu(this)" href="daftar_siswa.php">Daftar Peserta</a></li>
<li class="menu_awal"><a onclick="return load_menu(this)" href="daftar_nilai_mp.php">Lihat Nilai</a></li>
</ul>
(58)
<li class="menu_awal"><a onclick="return load_menu(this)" href="ganti_pass.php">Ganti Password</a></li>
<li class="menu_awal"><a href="logout.php">Keluar</a></li>
</ul> </div>
<div id="content"></div> </body>
</html> <?php } ?>
15. hal_siswa.php
<html> <head>
<link href="image/test.jpg" rel="shortcut icon">
<link href="css/soal.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery-1.5.1.min.js"></script> <script >
var info_loading = "<div style='font-size:110%;font-style:italic;font- weight:bolder;width:150px;margin:0 auto;' class='tombol loading'>Sedang proses ...</div>";
(59)
function load_menu(elm){
$(".menu_terpilih").eq(0).removeClass("menu_terpilih").addClass("menu_ awal");
$(elm).parent().removeClass("menu_awal").addClass("menu_terpilih"); var url = $(elm).attr("href");
$("#content").html(info_loading).load(url); return false;
}
$(function(){
$(".menu_awal>a").eq(0).click(); })
</script> </head> <body>
<div id="nav_menu">
<ul class="menu_kiri">
<li class="menu_awal"><a onclick="return load_menu(this)" href="beranda.php">Beranda</a></li>
<li class="menu_awal"><a onclick="return load_menu(this)" href="mp_siswa.php">Ujian</a></li>
</ul>
(60)
<li class="menu_awal"><a onclick="return load_menu(this)" href="profil.php"><?php echo
ucwords($_SESSION['nama_kj']) ?></a></li>
<li class="menu_awal"><a onclick="return load_menu(this)" href="ganti_pass.php">Ganti Password</a></li>
<li class="menu_awal"><a href="logout.php">Keluar</a></li>
</ul> </div>
<div id="content"> </div>
</body> </html> <?php } ?>
16. hapus_data.php
<?php
include_once "include/koneksi.php"; $status = 0;
$id_nilai = $_REQUEST['id_nilai']; $id_nama = $_REQUEST['id_nama']; $table = $_REQUEST['table'];
(61)
$sql = "delete from ".$table." where ".$id_nama."='".$id_nilai."'"; $sql_exe = mysql_query($sql);
if($sql_exe){ $status = 1; }
echo $status; ?>
17. hapus_nilai_ujian.php
<?php
include_once "include/koneksi.php"; $status = 0;
$nis = $_REQUEST['nis'];
$id_ujian = $_REQUEST['id_ujian']; $table = "nilai";
$sql = "delete from ".$table." where id_user='".$nis."' and id_ujian='".$id_ujian."'";
$sql_exe = mysql_query($sql); if($sql_exe){
$status = 1; }
echo $status; ?>
(62)
18. index.php
<?php session_start();
if(isset($_SESSION['login_kj'])){
header("location:hal_".$_SESSION['level_kj'].".php"); }
else { ?> <html> <head>
<link href="image/test.jpg" rel="shortcut icon"> <title>Ujian Online</title>
</head>
<body onload="document.forms[0]['id_user'].focus()"> <div id="div_login">
<fieldset>
<legend>Halaman login</legend> <?php
if(isset($_GET['info'])){ $display = "block";
$pemberitahuan = $_GET['info']; }
else{
(63)
$pemberitahuan = ""; }
?>
<div class="info" style="display:<?php echo $display ?>"><?php echo $pemberitahuan; ?></div>
<form action="login.php" method="post"> <div>
<label class="kiri">NIS atau No. Pendaftaran</label> <input type="text" class="inputan" name="id_user" placeholder="No. Pendaftaran"/>
</div> <div>
<label class="kiri">Password anda</label>
<input type="password" class="inputan" name="password" placeholder="Password"/>
</div> <div>
<label class="kiri"> </label>
<input type="submit" class="inputan tombol" value="Login"/>
</div> </form> </fieldset> </div>
(64)
</body> </html>
19. kerjakan_ujian.php
<?php
include_once "include/cek_session.php"; include_once "include/koneksi.php"; $id_ujian = $_REQUEST['id_ujian'];
$sql_ujian = "select * from v_ujian_mapel where id_ujian='".$id_ujian."'"; $sql_ujian_exe = mysql_query($sql_ujian);
$data_ujian = mysql_fetch_assoc($sql_ujian_exe); if(isset($_SESSION["mulai_".$id_ujian])){
$telah_berlalu = time() - $_SESSION["mulai_".$id_ujian]; }
else {
$_SESSION["mulai_".$id_ujian] = time(); $telah_berlalu = 0;
}
?>
<script type="text/javascript" src="js/jquery.countdown.js"></script> <!-- awal div header -->
<div id="header">
(65)
<div class="h_item">
<div class="item_kiri">Nama</div>
<div><?php echo $_SESSION['nama_kj']; ?></div> </div>
<div class="h_item">
<div class="item_kiri">Mata Pelajaran</div> <div><?php echo
ucwords($data_ujian['nama_mp'])." (
".ucwords($data_ujian['nama_ujian']).")" ?></div> </div>
</div>
<div id="h_item_kanan"> <div class="h_item">
<div class="item_kiri">Kelas</div> <div>Calon Siswa</div>
</div>
<div class="h_item">
<div class="item_kiri">Nilai</div> <div>0</div>
</div> </div>
<div id="timer">00 : 00 : 00</div> </div>
(66)
<!-- awal div tempat_soal --> <div id="tempat_soal"> <?php
// ambil pilihan jawaban dari database dan simpan de dalam array
$sql_pil = "select * from pil_jawaban where id_soal in (select id_soal from soal where id_ujian='".$id_ujian."') order by rand()";
$sql_pil_exe = mysql_query($sql_pil); if(mysql_num_rows($sql_pil_exe) > 0){ $data_pil_arr = array();
while($data = mysql_fetch_assoc($sql_pil_exe)){ if(isset($data_pil_arr[$data['id_soal']])){
$pil_jawabannya = array("id_jawaban" => $data['id_jawaban'],"status" => $data['status'],"jawaban" => $data['jawaban']);
array_push($data_pil_arr[$data['id_soal']],$pil_jawabannya); }
else {
$data_pil_arr[$data['id_soal']] = array(); $pil_jawabannya = array("id_jawaban" => $data['id_jawaban'],"status" => $data['status'],"jawaban" => $data['jawaban']);
array_push($data_pil_arr[$data['id_soal']],$pil_jawabannya); }
(67)
}
20. login.php
<?php
session_start();
include_once "include/koneksi.php";
// cek apakah id_user dan password telah terdaftar function cek_login($username,$pass){
$sql = "select * from user where id_user='".$username."' and password='".md5($pass)."'";
$sql_exe = mysql_query($sql); if(mysql_num_rows($sql_exe) > 0){
// simpan level dari user yang login
$data_login = mysql_fetch_assoc($sql_exe); $_SESSION['level_kj'] = $data_login['level']; return true;
} else {
return false; }
}
function ambil_data($username){
$sql = "select * from ".$_SESSION['level_kj']." where nis='".$username."'";
(68)
$sql_exe = mysql_query($sql);
$data = mysql_fetch_assoc($sql_exe); return $data;
}
$id_user = $_POST['id_user']; $pass = $_POST['password']; if(cek_login($id_user,$pass)){
$data_siswa = ambil_data($id_user); // buat session berdasarkan data siswa $_SESSION['nis_kj'] = $data_siswa['nis']; $_SESSION['nama_kj'] = $data_siswa['nama']; $_SESSION['login_kj'] = true;
header("location:hal_".$_SESSION['level_kj'].".php"); }
else{
header("location:index.php?info=Username atau password salah"); }
?>
21. logout.php
<?php session_start(); session_destroy();
(69)
?>
22. mp_siswa.php
<?php
include_once "include/koneksi.php"; ?>
<div class="daftar_pelajaran"> <fieldset>
<legend>Pilih Mata Pelajaran</legend> <?php
// ambil data mata pelajaran dari database
$mp_exe = mysql_query("select * from mapel"); $jml_mp = mysql_num_rows($mp_exe);
if($jml_mp > 0){ ?>
<ul>
<?php
while($data = mysql_fetch_assoc($mp_exe)){
$jml_ujian = mysql_result(mysql_query("select count(*) from ujian where id_mp='".$data['id_mp']."'"),0);
echo "<div
onclick=\"lihat_ujian_siswa('".$data['id_mp']."')\"><span class='jml_ujian'>".$jml_ujian."</span><li><a
(70)
echo "<div class='tombol edit' >Daftar ujian</div>"; echo "</div>";
}
?> </ul> <?php
} else {
echo "Mata Pelajaran Belum Dibuat"; }
?>
</fieldset> </div> <script>
function lihat_ujian_siswa(id_mp){
// load content dengan data dari daftar_ujian.php
$("#content").html(info_loading).load("daftar_ujian_siswa.php?id_mp="+ id_mp);
} </script>
(71)
23. profil.php
<?php
session_start();
include_once "include/koneksi.php"; ?>
<div style="margin:0 auto;width:50%;padding:10px"> <fieldset>
<legend>Data Pribadi</legend>
<?php
// ambil data mata pelajaran dari database $tabel = $_SESSION['level_kj'];
$nis = $_SESSION['nis_kj'];
$profil_exe = mysql_query("select * from ".$tabel." where nis='".$nis."'"); $data_profil = mysql_fetch_assoc($profil_exe);
foreach($data_profil as $index => $nilai){ echo "<div class='div_profil'><div
class=l_kiri>".ucwords($index)."</div><div>".ucwords($nilai)."</div></div >";
} ?>
</fieldset> </div>
(72)
24. simpan_form.php
<?php
//error_reporting (E_ALL ^ E_NOTICE); include_once "include/koneksi.php"; include_once "include/fungsi.php"; $status = 0;
$data = $_REQUEST['data']; $tabel = $_REQUEST['tbl'];
for($i = 0; $i < count($data); $i++){ $data_ar=$data[$i];
foreach($data_ar as $id => $nil){ if($id == 'value'){
$nilai[]=mysql_escape_string($data_ar[$id]); }
else
$nama[]=$data_ar[$id]; }
}
$str_nilai = buatStringNilai($nilai); $str_kolom = buatStringKolom($nama);
$sql = "insert into ".$tabel." (".$str_kolom.") values (".$str_nilai.")"; $sql_exe = mysql_query($sql);
if($sql_exe){ $status = 1;
(73)
}
echo $status; ?>
25. simpan_soal.php
<?php
include_once "include/koneksi.php"; $data = $_REQUEST['data'];
$id_soal = $data['0']; $id_ujian = $data['1']; $pertanyaan = $data['2']; $pil_jawaban = $data['3']; $status = 0;
// simpan ke tabel soal
$sql_soal = "insert into soal values
('".$id_soal."','".$id_ujian."','".mysql_escape_string($pertanyaan)."')"; $sql_pil = "insert into pil_jawaban (id_soal,jawaban,status) values "; $data_pil = "";
foreach($pil_jawaban as $pilihan){ $data_pil .=
"('".$id_soal."','".mysql_escape_string($pilihan['0'])."','".$pilihan['1']."'),"; }
$data_pil = substr($data_pil,0,strlen($data_pil) - 1); $sql_pil .= $data_pil;
(74)
$soal_exe = mysql_query($sql_soal); if($soal_exe){
$pilihan_exe = mysql_query($sql_pil); $status = 1;
}
echo $status; ?>
26. update_data.php
<?php
include_once "include/koneksi.php"; include_once "include/fungsi.php"; $status = 0;
$data = $_REQUEST['data']; $tabel = $_REQUEST['table']; for($i = 0; $i < count($data); $i++){
$data_ar=$data[$i];
foreach($data_ar as $id => $nil){ if($id == 'value'){
$nilai[]=mysql_escape_string($data_ar[$id]); }
else
$nama[]=$data_ar[$id]; }
(75)
}
$sql = "update ".$tabel." set ".buatStringUpdateId($nama,$nilai); $sql_exe = mysql_query($sql);
if($sql_exe){ $status = 1; }
echo $status; ?>
27. view_jawaban.php
<?php
include_once "include/cek_session.php"; include_once "include/koneksi.php"; $id_ujian = $_REQUEST['id_ujian'];
$sql_ujian = "select * from v_ujian_mapel where id_ujian='".$id_ujian."'"; $sql_ujian_exe = mysql_query($sql_ujian);
$data_ujian = mysql_fetch_assoc($sql_ujian_exe);
$nilai_exe = mysql_query("select nilai,detail_jawaban from nilai where id_user='".$_SESSION['nis_kj']."' and id_ujian='".$id_ujian."'"); $data_nilai = mysql_fetch_assoc($nilai_exe);
$jawaban_siswa_terpilih = explode(",",$data_nilai["detail_jawaban"]); ?>
<link href="css/soal.css" rel="stylesheet" type="text/css" /> <!-- awal div header -->
(76)
<div id="header">
<div id="h_item_kiri"> <div class="h_item">
<div class="item_kiri">Nama</div>
<div><?php echo $_SESSION['nama_kj']; ?></div> </div>
<div class="h_item">
<div class="item_kiri">Mata Pelajaran</div> <div><?php echo
ucwords($data_ujian['nama_mp'])." (
".ucwords($data_ujian['nama_ujian']).")" ?></div> </div>
</div>
<div id="h_item_kanan"> <div class="h_item">
<div class="item_kiri">Kelas</div> <div>Calon Siswa</div>
</div>
<div class="h_item">
<div class="item_kiri">Nilai</div>
<div><?php echo $data_nilai['nilai'] ?></div> </div>
(77)
</div><!-- akhir div header -->
<!-- awal div tempat_soal --> <div id="tempat_soal"> <?php
$sql_pil = "select * from pil_jawaban where id_soal in (select id_soal from soal where id_ujian='".$id_ujian."') order by rand()";
$sql_pil_exe = mysql_query($sql_pil); if(mysql_num_rows($sql_pil_exe) > 0){ $data_pil_arr = array();
while($data = mysql_fetch_assoc($sql_pil_exe)){ if(isset($data_pil_arr[$data['id_soal']])){
$pil_jawabannya = array("id_jawaban" => $data['id_jawaban'],"status" => $data['status'],"jawaban" => $data['jawaban']);
array_push($data_pil_arr[$data['id_soal']],$pil_jawabannya); }
else {
$data_pil_arr[$data['id_soal']] = array(); $pil_jawabannya = array("id_jawaban" => $data['id_jawaban'],"status" => $data['status'],"jawaban" => $data['jawaban']);
array_push($data_pil_arr[$data['id_soal']],$pil_jawabannya); }
(78)
}
$sql_soal = "select * from soal where id_ujian='".$id_ujian."' order by rand()";
$sql_soal_exe = mysql_query($sql_soal); $no = 0;
while($soalnya = mysql_fetch_assoc($sql_soal_exe)){ $no++;
echo '
<div class="soal_ujian">
<div class="no_soal">'.$no.'</div> <div class="isi_soal">
<div
class="pertanyaan">'.$soalnya["isi_soal"].'</div>';
// $sql_pil = "select * from pil_jawaban where id_soal='".$soalnya['id_soal']."' order by rand()";
// $sql_pil_exe = mysql_query($sql_pil); // while($data_pil =
mysql_fetch_assoc($sql_pil_exe)){
// echo '<div class="pilihan_jawaban"><input type="radio" name="'.$data_pil['id_soal'].'" value="'.$data_pil['status'].'" onclick="koreksi(this)"/><div>'.$data_pil['jawaban'].'</div></div>';
// }
(79)
if(in_array($data_pil["id_jawaban"],$jawaban_siswa_terpilih)){ $checked_radio = "checked"; $class_div = "radio_terpilih"; }
else {
$checked_radio = ""; $class_div = ""; }
echo '<div class="pilihan_jawaban
'.$class_div.'"><input alt="'.$data_pil["id_jawaban"].'" type="radio" name="'.$soalnya["id_soal"].'" value="'.$data_pil['status'].'"
'.$checked_radio.' /><div>'.$data_pil['jawaban'].'</div></div>'; }
echo '</div> </div> ';
} } else {
echo "soal masih belum ada !!!!!!!!!"; }
(80)
SURAT KETERANGAN Hasil Uji Program Tugas Akhir
Yang bertanda tangan dibawah ini, menerangkan bahwa Mahasiswa Tugas Akhir Program Diploma 3 Teknik Informatika:
Nama : LOUISTEN MANALU NIM : 132406179
Prog. Studi : Diploma (D3) Teknik Informatika
Judul Tugas Akhir : Perancangan Aplikasi Ujian Online Berbasi Web
Telah melaksanakan test program Tugas Akhir Mahasiswa tersebut di atas pada tanggal ……….
Dengan Hasil : Sukses / Gagal
Demikian diterangkan untuk digunakan melengkapi syarat pendaftaran Ujian Meja Hijau Tugas Akhir Mahasiswa bersangkutan di Departemen Matematika FMIPA USU Medan.
Medan, Juni 2016 Dosen Pembimbing
Dr. Suwarno Ariswoyo, M.Si NIP. 195021031980031001
(81)
KEMENTERIAN PENDIDIKAN NASIONAL UNIVERSITAS SUMATERA UTARA
FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM Jl. Bioteknologi No.1 Kampus USU Padang Bulan Medan-20155
Telp. (061) 8211050, Fax. (061) 8214290
KARTU BIMBINGAN TUGAS AKHIR MAHASISWA
Nama Mahasiswa : LOUISTEN MANALUNomor Stambuk : 132406179
Judul Tugas Akhir : APLIKASI UJIAN ONLINE
Dosen Pembimbing : Dr. Suwarno Ariswoyo, M.Si Tanggal Mulai Bimbingan :
Tanggal Selesai Bimbingan :
No. Tanggal Asisten Bimbingan
Pembahasan pada Asistensi Mengenai, pada
Bab :
Paraf Dosen Pembimbing
Keterangan
1. 15 Maret 2016 ACC Judul
2. 05 April 2016 Konsultasi Proposal 3. 07 April 2016 ACC Proposal 4. 25 April 2016 ACC BAB 1 5. 24 Mei 2016 ACC BAB 2 6. 06 Juni 2016 ACC BAB 3 7. 13 Juni 2016 ACC BAB 4 & 5 8. 20 Juni 2016 Melengkapi
Kartu ini harap dikembalikan ke Departemen Matematika bila bimbingan telah selesai.
Diketahui, Disetujui,
Ketua Prog.Studi D3Teknik Informatika, Dosen Pembimbing,
Dr. Elly Rosmaini, M.Si. Dr. Suwarno Ariswoyo, M.Si NIP 196 005 201 985 032 002 NIP. 195021031980031001
(82)
KEMENTERIAN PENDIDIKAN NASIONAL UNIVERSITAS SUMATERA UTARA
FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM Jl. Bioteknologi No.1 Kampus USU Padang Bulan Medan-20155
Telp. (061) 8211050, Fax. (061) 8214290
KARTU BIMBINGAN TUGAS AKHIR MAHASISWA
Nama Mahasiswa : WALDO PANJAITANNomor Stambuk : 132406155
Judul Tugas Akhir : APLIKASI SISTEM INVENTORY BUKU PADA YAYASAN ALUSI TAO TOBA
Dosen Pembimbing : Dr. Suwarno Ariswoyo, M.Si Tanggal Mulai Bimbingan :
Tanggal Selesai Bimbingan :
No. Tanggal Asisten Bimbingan
Pembahasan pada Asistensi Mengenai, pada
Bab : Paraf Dosen Pembimbing Keterangan 1. 2. 3. 4. 5. 6. 7. 8.
Kartu ini harap dikembalikan ke Departemen Matematika bila bimbingan telah selesai.
Diketahui, Disetujui,
Ketua Prog.Studi D3Teknik Informatika, Dosen Pembimbing,
Dr. Elly Rosmaini, M.Si. Dr. Suwarno Ariswoyo, M.Si NIP 196 005 201 985 032 002 NIP. 195021031980031001
(83)
DAFTAR PUSTAKA
Atkinson, Leon. 2004. Core PHP Programming. Third Edition. USA: Prentice Hall PTR.
ASP Reference Manual, Microsoft, 1999.
Betha dan Epsi Budiharjo, Client Side Programming, PIKSI-ITB, 2001. Darmawan, Dilar. 2007 Aplikasi PHP pada Website Online Examination.
Kadir, Abdul, 2008, Dasar Pemograman WEB Dinamis Menggunakan PHP, penerbit Andi.
Meloni, Julie C.2002. Sams Teach Yourself PHP, MySQL and Apache in 24 Hours. USA: Sams Publishing.
http://Microsoft.com
Saputra, Agus, 2011. Pemograman CSS Untuk Pemula. Jakarta : PT. Gramedia. Syafi’i. 2009. Rancang Bangun Aplikasi Online untuk Ujian Masuk Jalur Reguler Di
Universitas Islam Negeri (UIN) Maulana Malik Ibrahim Malang. http://W3Schools.com, 2002
(84)
BAB 3
PERANCANGAN SISTEM
3.1 Perancangan Sistem
Seiring dengan perkembangan teknologi informasi saat ini, serta untuk meningkatkan efesiensi kerja dan waktu, maka masih banyak sistem yang ada saat ini yang masih manual dan harus diganti dengan sistem yang lebih baik lagi. Hal ini dilakukan dengan cara membangun sistem yang terkomputerisasi atau online. Untuk memulai membangun suatu program mengenai perancangan system informasi akademik, maka penulis terlebih dahulu merencanakan alur kerja berdasarkan kebutuhan dari user yang akan menggunakan aplikasi basis data ini.
Perancangan merupakan proses yang dilakukan oleh perancang sistem untuk mengerjakan spesifikasi sistem, membuat keputusan tentang bagaimana komponen system diaktualisasikan. Proses ini menyangkut tujuan sistem tersebut, audience, objek dan informasi domain. Perancangan yang baik harus mengetahui bagaimana mendapatkan efek yang dibutuhkan oleh spesifikasi tersebut dengan cara paling fleksibel, efesien dan elegan.
(85)
26
3.2 Data Flow Diagram (DFD) Perancangan Aplikasi
Data Flow Diagram (DFD) merupakan model dari sistem untuk menggambarkan
pembagian sistem ke modul yang lebih kecil. Salah satu keuntungan menggunakan diagram alir data adalah memudahkan pemakai yang kurang menguasai bidang komputer untuk mengerti sistem yang akan dikerjakan. Pada tahap analisa, penanganan notasi simbol lingkaran dan anak panah menggambarkan arus data dalam perancangan sistem sangat membantu dalam komunikasi dengan pemakaian sistem menggunakan notasi – notasi untuk menggambarkan arus dari data sistem.
Disamping itu DFD adalah salah satu alat pembuatan model yang sering digunakan, khususnya bila fungsi – fungsi sistem merupakan bagian yang lebih penting dan kompleks dari pada data yang dimanipulasi oleh sistem. Dengan kata lain, DFD adalah alat pembuatan model yang memberikan penekanan hanya pada fungsi sistem.
DFD juga merupakan alat perancangan sistem yang berorientasi pada alur data dengan konsep dekomposisi dapat digunakan untuk penggambaran analisa maupun rancangan sistem yang mudah dikomunikasikan oleh profesional sistem kepada pemakai maupun pembuat program.
(86)
27
3.2.1 Diagram Konteks Aplikasi Ujian Online
Diagram Konteks adalah sebuah diagram sederhana yang menggambarkan hubungan antara entity luar, masukan dan keluaran dari sistem. Diagram konteks direpresentasikan dengan lingkaran tunggal yang mewakili keseluruhan sistem.
Berikut ini adalah diagram konteks dari ujian online:
ADMIN
Daftar Peserta
Input Soal
Daftar Nilai Peserta
Daftar Peserta Ujian
SISTEM UJIAN ONLINE
Input Jawaban
Data Peserta
Data Soal
Data Nilai
PESERTA
(87)
28
3.2.2 Data Flow Diagram (DFD) Level 0
DATAPESERTA
DATA
PESERTA LOGIN ADMIN DATAUJIAN
DATAMAPEL
MAPEL
DATAADMIN
ADMIN
DATAPESERTA
PESERTA DATAPESERTA
DATANILAI
DATAJAWABAN
UJIAN
NILAI
DATASOAL
SOAL
DATANILAI
NILAI
Gambar 3.2.2 Data Flow Diagram (DFD) Level 0
3.3 Perancangan Database Aplikasi
Database adalah kumpulan dari data yang berhubungan antara yang satu dengan
yang lainnya, tersimpan diperangkat keras komputer dan menggunakan perangkat lunak untuk memanipulasinya. Database merupakan salah satu komponen yang
(88)
29
penting dalam sistem komputerisasi, karena database merupakan kumpulan dari beberapa file, dalam hal ini file –file tersebut dikelompokan secara terstruktur dalam beberapa tabel sesuai dengan informasi yang terkandung di dalamnya.
3.3.1 Relationship (Relasi Antar Tabel)
Tabel saling berelasi dalam aplikasi ujian online ini. Relasi antar tabel ditunjukan pada Gambar 3.3.1
admin nis nama alamat agama mapel id_mp nama_mp user id_user password level peserta nis nama alamat agama soal id_soal id_ujian isi_soal ujian id_ujian nama_ujian id_mp tanggal waktu keterangan pil_jawaban nilai id_nilai id_user id_ujian nilai detail_jawaban id_jawaban id_soal jawaban status
(1)
ABSTRAK
Sistem ujian online merupakan salah satu bagian sistem informasi pendidikan jarak jauh melalui media teknologi internet. Ujian yang dilakukan oleh sebagian besar institusi pendidikan, dalam hal ini universitas masih dilaksanakan secara konvensional. Konsep Ujian online yang tidak terkait ruang dan waktu dapat menjadi solusi atas kendala yang ada pada metode ujian yang konvensional. Sistem ini bertujuan untuk mempermudah dosen dalam memberikan ujian dan proses pemberian nilai ujian yang efektif dan efisien karena proses penilaian diberikan langsung saat mahasiswa selesai mengerjakan ujian.
Penelitian dilakukan dengan mengamati sistem secara langsung sehingga didapatkan hasil analisis mengenai kebutuhan sistem. Sebagai dasar dan acuan untuk membuat sistem ujian online dilakukan studi pustaka kemudian membuat perancangan database sistem menggunakan DFD dan ERD. Bahasa pemograman yang digunakan adalah PHP dan MySQL sebagai databasenya. Soal yang disajikan dalam sistem pilihan ganda.
Implementasi dari sistem ujian online ini dibuat dengan fasilitas meliputi manajemen ujian, manajemen soal ujian, manajemen data dosen dan mahasiswa yang nantinya akan menghasilkan keluaran nilai.
(2)
ABSTRACT
Online examination system is the part of the distance learning information systems using the technology of internet. Exam which performed by most education institutions in this case the university was done conventionally. The concept of an online exam, which is not limited with space and time can be solution to the constraints that exist on the conventional test methods. This system is aimed so lecturer can give exams and grading examinations to give effective and efficient process easier, because the process of grading is done right when students have completed the examination.
Research carried out by observing the system directly, to obtain the results of the system requirements analysis. As a basis and reference for an online exam system has been conducted by performed literature study and then create a database system design and use of DFD. The programming language using PHP and MySQL as its database. The questions are presented in multiple choice system.
The implementation of this online examination create some facilities such as exam management, teachers and students data management, the output in the form of test results to grades.
Kata kunci : Online exam, Website, PHP, MySQL
(3)
DAFTAR ISI
Halaman
Persetujuan i
Pernyataan ii
Penghargaan iii
Abstrak iv
Abstract v
Daftar Isi vi
Daftar Tabel viii
Daftar Gambar ix Bab 1. Pendahuluan
1.1 Latar Belakang 1
1.2 Identifkasi Masalah 2
1.3 Batasan Masalah 3
1.4 Maksud dan Tujuan 3
1.5 Metode Penelitian 4
1.6 Sistematika Penulisan 5
Bab 2. Landasan Teori
2.1 Konsep Dasar Ujian, Ujian Online 7
2.1.1 Ujian 7
2.1.2 Ujian Online 10
2.2 Internet 10
2.3 WWW (World Wide Web) 11
2.4 HTML (Hyper Text Markup Languange) 13
2.4.1 Penamaan Dokumen HTML 13
2.4.2 Elemen dan Tag HTML 14
2.5 PHP (Hypertext Propocessor) 17
2.5.1 Sejarah Asal Mula PHP 18
2.5.2 Variabel Pada PHP 19
2.5.3 Konsep Dasar Penggunaan PHP 20
2.6 MySQL 21
2.7 CSS (Cascanding Style Sheet) 22
2.8 JavaScript 22
(4)
3.2 Data Flow Diagram (DFD) Perancangan Aplikasi 26
3.2.1 Diagram Konteks Ujian Online 27
3.2.2 Data Flow Diagram Level 0 28
3.3 Perancangan Database Aplikasi 28
3.3.1 Relationship (Relasi Antar Tabel) 29
3.3.2 Struktur Tabel 30
3.4 Flowchart Perancangan Aplikasi Ujian Online 33
3.4.1 Flowchart Login Admin 33
3.4.2 Flowchart Halaman Admin 34
3.4.3 Flowchart Peserta 35
Bab 4. Implementasi Sistem
4.1 Pengertian Implementasi Sistem 36
4.2 Tujuan Implementasi 37
4.3 Komponen Dalam Implementasi Sistem 37
4.3.1 Komponen Perangkat Keras (Hardware) 38 4.3.2 Komponen Perangkat Lunak (Software) 38
4.3.3 Kebutuhan Brainware 39
4.4 Tampilan Halaman Website 39
Bab 5. Kesimpulan dan Saran
5.1 Kesimpulan 45
5.2 Saran 45
Daftar Pustaka Lampiran
(5)
DAFTAR TABEL
Nomor Tabel
Judul Halaman
3.1 Tabel Admin 30
3.2 Tabel Mapel 30
3.3 Tabel Nilai 30
3.4 Tabel Pil_jawaban 31
3.5 Tabel Peserta 31
3.6 Tabel Soal 32
3.7 Tabel ujian 32
(6)
DAFTAR GAMBAR
Nomor Gambar
Judul Halaman
3.2.1 Diagram Konteks Ujian Online 27
3.2.2 Data Flow Diagram (DFD) Level 0 28
3.3.1 Relationship (Relasi Antar Tabel) 29
3.4.1 Alur Flowchart Admin 33
3.4.2 Alur Flowchart Halaman Admin 34
3.4.3 Alur Flowchart Halaman Peserta 35
4.4.1 Halaman Login 39
4.4.2 Halaman Beranda Admin 40
4.4.3 Halaman Daftar Ujian 40
4.4.4 Halaman Tambah Ujian 41
4.4.5 Halaman Tambah Soal Ujian 41
4.4.6 Halaman Daftar Peserta 42
4.4.7 Halaman Lihat Nilai 42
4.4.8 Halaman Ganti Password 43
4.4.9 Halaman Beranda Peserta 43
4.4.10 Halaman Daftar Ujian Peserta 44