Professional Documents
Culture Documents
bag.1
Pada Postingan kali ini saya akan berbagai tentang membuat Sistem Informasi Akademik
sangat sederhana, sebelumnya kita harus persiapkan sebagai berikut :
1. Software host server lokal , karena kita akan bekerja secara offline saya contohkan
mengggunakan Xampp bisa didownload di sini
2. Editornya saya contohkan menggunakan Notepad++ bisa didownload di sini
3. Setelah di install xampp nya, kemudian buatlah folder di tempat xampp yang kita
installkan didalam folder htdocs, contoh di c:/xampp/htdocs/SIS/ folder SIS inilah
folder kerja kita, semua file yang kita buat kita simpan di folder ini.
4. Untuk mengakses file-file yang telah kita buat dengan host server lokal misal
http://localhost/SIS/index.html, localhost (host lokal kita) SIS(folder file tersimpan)
index.html(file yang dipanggil).
Oke, langsung pada tutorial pertama, pertama kita buat halaman utama dari SIA ini, buatlah
halaman css dengan nama file global.css dan simpanlah di folder SIS, untuk source code seperti
berikut :
Setelah itu buatlah file index.html dan simpanlah di folder SIS, untuk source code seperti
berikut :
akseslah host server lokal anda misal http://localhost/SIS/index.html untuk melihat hasil coding
kita barusan.
*Gambar bisa diperbesar dengan double klik
Selamat Mencoba!
Setelah sembelumnya dengan postingan untuk membuat halaman utama kini pada postingan ini
saya akan mencontohkan membuat page input data siswa,
Pertama buatlah dokumen html dengan nama file datasiswa.html dan simpanlah pada folder SIS
di host server lokal kita.
<html>
<body bgcolor="lavender">
<center>
<h3>Form Input Data Siswa</h3>
<h4><font color="blue">SMAN Bandung</font></h4>
<form method = post action = msksiswa.php>
<style type = "text/css">
<!--
td { font-weight : bold;
background-color: maroon;
color : white; }
tr { background-color: silver;
color: blue; }
-->
</style>
<table border =1>
<tr><td>NIS </td>
<td>: <input type = text name="NIS"></td></tr>
<tr><td>Nama Siswa </td>
<td>: <input type = text name="namasiswa"></td></tr>
<tr><td>E-mail</td>
<td>: <input type = text name="email"></td></tr>
<tr><td>No Ponsel</td>
<td>: <input type = text name="ponsel"></td></tr>
<tr><td>Alamat </td>
<td>: <input type = text name ="alamat"></td></tr>
<tr><td>Tempat Lahir </td>
<td>: <input type = text name ="tmptlhr"></td></tr>
<tr><td>Tanggal Lahir </td>
<td>: <input type = date name ="tgllhr"></td></tr>
<tr><td>Agama </td>
<td>: <input type = text name ="agama">
</td></tr>
<tr><td><input type=submit value ="Simpan">
<input type=reset value="Reset"></td></tr>
</center></table>
</form>
</body>
</html>
selanjutnya buatlah dokumen untuk proses input dengan nama file msksiswa.php simpanlah
pada folder SIS di host server lokal kita.
<?php
include "koneksidb.php";
//definisikan variabel dari Formmhs
$NIS = $_POST['NIS'];
$namasiswa = $_POST['namasiswa'];
$email = $_POST['email'];
$ponsel = $_POST['ponsel'];
$alamat = $_POST['alamat'];
$tmptlhr = $_POST['tmptlhr'];
$tgllhr = $_POST['tgllhr'];
$agama = $_POST['agama'];
//simpan data
$input ="insert into datasiswa(NIS,namasiswa,email,ponsel,alamat,tmptlhr,tgllhr,agama)
values('$NIS','$namasiswa','$email','$ponsel','$alamat','$tmptlhr','$tgllhr','$agama')";
mysql_query($input);
if ($input)
{
header("location:menampilkan.php");
}
else
{
echo "Proses Input Gagal";
}
?>
bila dijalakan dokumen diatas http://localhost/SIS/datasiswa.html maka akan tampil seperti
berikut :
*gambar bisa diperbesar dengan melakukan double klik pada gambar
Selamat mencoba!!
Pada postingan ini akan dibahasa tentang membuat database menggunakan MySql untuk
menyimpan input semua data yang nanti kita akan inputkan di sistem informasi akademik
sederhana ini, kali ini saya akan mencontohkan membuat table database untuk input datasiswa
terlebih dahulu ,
pertama akseslah http://localhost/phpmyadmin dan buatlah database baru misal dengan nama
database smabandung
*gambar bisa diperbesar dengan double klik pada tiap gambar
Setelah itu beri nama tablenya dengan tabel datasiswa isi number fieldnya 8 karena kita akan
memasukan 8 input data ke database, bila selesai klik Go
setelah itu :
selanjutnya bila telah pada halaman seperti digambar maka jadikanlah NIS sebagai primary key,
dengan meng-klik icon kunci pada action NIS
Selamat mencoba!
Pada postingan tutorial kali ini akan dicontohkan source code untuk menampilkan data yang
telah di input ke database yang sebelumnya kita telah dibuat:
pertama sebelumnya kita buat dulu dokumen koneksidb.php simpan di folder SIS yang , source
codenya :
<?php
$link=mysql_connect("localhost","root","");
mysql_select_db("smabandung",$link);
?>
setelah itu buat dokumen untuk menampilkan data yang telah dimasukan ke database, simpan
dengan nama file menampilkan.php, source code :
<?php
include "koneksidb.php";
$tampil="select * from datasiswa";
$hasil=mysql_query($tampil);
echo"<body bgcolor='lavender'>";
echo"Daftar Siswa";
echo"<style type = 'text/css'>
<!--
th { font-weight : bold;
background-color: blue;
color : white; }
tr { background-color: silver;
color: blue; }
-->
</style>";
echo"<table border=1>";
echo"<tr><th>No.</th>
<th>NIS </th>
<th>Nama Siswa </th>
<th>E-Mail </th>
<th>Ponsel </th>
<th>Alamat </th>
<th>Tempat Lahir </th>
<th>Tanggal Lahir </th>
<th>Agama</th><tr>";
$nomor=1;
while ($data=mysql_fetch_array($hasil))
{
echo "<tr><td>$nomor</td>";
echo "<td>$data[0]</td>";
echo "<td>$data[1]</td>";
echo "<td>$data[2]</td>";
echo "<td>$data[3]</td>";
echo "<td>$data[4]</td>";
echo "<td>$data[5]</td>";
echo "<td>$data[6]</td>";
echo "<td>$data[7]</td></tr>";
$nomor++;
}
echo"</table>";
echo "<a href='index.html'>Kembali</a>";
echo "</body>";
?>
Selamat mencoba!
Pada tutorial lanjutan ini saya akan mencontohkan untuk membuat halaman edit data siswa
untuk admin
buatlah dokumen dengan naman file inputsiswaadmin.php simpan di folder SIS,
<?php
echo "<body bgcolor='lavender'>";
echo "<center>";
echo "<h3> Data Siswa di Halaman Admin </H3>";
include "koneksidb.php";
$tampilsiswa ="select * from datasiswa ORDER BY NIS DESC";
$hasil = mysql_query($tampilsiswa);
$total = mysql_num_rows($hasil);
echo "<style type = 'text/css'>
<!--
td { font-weight : bold;
background-color: lavender;
color : maroon; }
tr { background-color: silver;
color: blue; }
-->
</style>";
Selamat mencoba!!