Anda di halaman 1dari 12

Membuat Sistem Informasi Akademik Sangat Sederhana dengan PHP MySql 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 se ara offline saya ontohkan mengggunakan !ampp bisa didownload di sini ". #ditornya saya ontohkan menggunakan $otepad%% bisa didownload di sini &. Setelah di install 'ampp nya, kemudian buatlah folder di tempat 'ampp yang kita installkan didalam folder htdocs, ontoh di c:/ am!!/htdocs/SIS/ folder SIS inilah folder kerja kita, semua file yang kita buat kita simpan di folder ini. (. )ntuk mengakses file*file yang telah kita buat dengan host server lokal misal htt!://localhost/SIS/inde .html" lo alhost +host lokal kita, SIS+folder file tersimpan, inde'.html+file yang dipanggil,. -ke, langsung pada tutorial pertama, pertama kita buat halaman utama dari SIA ini, buatlah halaman ss dengan nama file global.css dan simpanlah di folder SIS, untuk sour e ode seperti berikut : #halaman{/*"id" dilambangkan dengan "#"*/ width: 1348px; margin:0px auto;/*agar dokumen berada ditengah*/ padding:0px atuo; ba kground:!la k; " ##udul{ width:100$; height:100px; ba kground:#%&'()*; margin:0px; /*pengaturan +i+i bagian luar*/ padding:0px; /*pengaturan +i+i bagian dalam*/ " #konten{ width:100$; margin:0px; padding:0px; " ,kiri{/*" la++" dilambangkan dengan "," titik*/ width:-%$; height:4%0px; .loat:le.t; ba kground:#)//8(0;

" ,tengah{ width:1%$; height:4%0px; .loat:le.t; ba kground:#&/&%(0; " ,.ooter{ height:40px; ba kground:#8&!28&; lear:both; " ,#udul{ olor:brown; padding:10px 0 0 10px; /*3enuli+an untuk +emua +i+i ata+ kanan bawah kiri*/ " ,+ub4#udul{ olor:5ellow; padding:0 10px 10px 10px; " p{ padding4le.t:10px;/*penuli+an untuk +emua +i+i +a#a*/ " Setelah itu buatlah file inde .html dan simpanlah di folder SIS, untuk sour e ode seperti berikut : 6html76head76title789) 8:) ; !andung6/title7 6link hre.<"global, ++" rel<"+t5le+heet" t5pe<"text/ ++"76/head7 6bod57 6di= id<"halaman"7 6di= id<"#udul"7 6h1 la++<"#udul"78i+tem 9n.orma+i )kademik 8ederhana6/h17 6h- la++<"+ub4#udul"78:); !andung6/h-7 6/di=7 6di= id<"konten"7 6di= la++<"kiri"7 6p73ilihan 6/di=7 6di= la++<"tengah"7 6p78elamat /atang di 89) 8:); !andung6/p7 6/di=7 6/di=7 6/di=7 6di= la++<".ooter"76 enter7 6p7/ibuat oleh 8:); !andung >-0116/p76/ enter7

:enu6/p7

6/di=7 6/di=7 6/bod57 6/html7

Membuat Sistem Informasi Akademik Sangat Sederhana dengan PHP MySql bag.#
Setelah sembelumnya dengan postingan untuk membuat halaman utama kini pada postingan ini saya akan men ontohkan membuat page input data siswa, Pertama buatlah dokumen html dengan nama file datasis$a.html dan simpanlah pada folder SIS di host server lokal kita. 6html7 6bod5 bg olor<"la=ender"7 6 enter7 6h37&orm 9nput /ata 8i+wa6/h37 6h476.ont olor<"blue"78:); !andung6/.ont76/h47 6.orm method < po+t a tion < m+k+i+wa,php7 6+t5le t5pe < "text/ ++"7 6?44 td { .ont4weight : bold; ba kground4 olor: maroon; olor : white; " tr { ba kground4 olor: +il=er; olor: blue; " 447 6/+t5le7 6table border <17 6tr76td7;98 6/td7 6td7: 6input t5pe < text name<";98"76/td76/tr7 6tr76td7;ama 8i+wa 6/td7 6td7: 6input t5pe < text name<"nama+i+wa"76/td76/tr7 6tr76td7(4mail6/td7 6td7: 6input t5pe < text name<"email"76/td76/tr7 6tr76td7;o 3on+el6/td7 6td7: 6input t5pe < text name<"pon+el"76/td76/tr7 6tr76td7)lamat 6/td7 6td7: 6input t5pe < text name <"alamat"76/td76/tr7 6tr76td7@empat Aahir 6/td7 6td7: 6input t5pe < text name <"tmptlhr"76/td76/tr7

6tr76td7@anggal Aahir 6/td7 6td7: 6input t5pe < date name <"tgllhr"76/td76/tr7 6tr76td7)gama 6/td7 6td7: 6input t5pe < text name <"agama"7 6/td76/tr7 6tr76td76input t5pe<+ubmit =alue <"8impan"7 6input t5pe<re+et =alue<"Be+et"76/td76/tr7 6/ enter76/table7 6/.orm7 6/bod57 6/html7 selanjutnya buatlah dokumen untuk proses input dengan nama file msksis$a.!h! simpanlah pada folder SIS di host server lokal kita. 6Cphp in lude "konek+idb,php"; //de.ini+ikan =ariabel dari &ormmh+ D;98 < DE3*8@FG;98GH; Dnama+i+wa < DE3*8@FGnama+i+waGH; Demail < DE3*8@FGemailGH; Dpon+el < DE3*8@FGpon+elGH; Dalamat < DE3*8@FGalamatGH; Dtmptlhr < DE3*8@FGtmptlhrGH; Dtgllhr < DE3*8@FGtgllhrGH; Dagama < DE3*8@FGagamaGH; //+impan data Dinput <"in+ert into data+i+waI;98Jnama+i+waJemailJpon+elJalamatJtmptlhrJtgllhrJagamaK =alue+IGD;98GJGDnama+i+waGJGDemailGJGDpon+elGJGDalamatGJGDtmptlhrGJGDtgllhrGJGDagamaGK"; m5+LlELuer5IDinputK; i. IDinputK { headerI"lo ation:menampilkan,php"K; " el+e { e ho "3ro+e+ 9nput Magal"; " C7

Membuat Sistem Informasi Akademik Sangat Sederhana dengan PHP MySql bag.%
Pada postingan ini akan dibahasa tentang membuat database menggunakan .yS/l untuk menyimpan input semua data yang nanti kita akan inputkan di sistem informasi akademik sederhana ini, kali ini saya akan men ontohkan membuat table database untuk input datasiswa terlebih dahulu , pertama akseslah htt!://localhost/!h!myadmin dan buatlah database baru misal dengan nama database smabandung 0gambar bi+a diperbe+ar dengan double klik pada tiap gambar

Setelah itu beri nama tablenya dengan tabel datasis$a isi number fieldnya & karena kita akan memasukan 1 input data ke database, bila selesai klik 'o

setelah itu : 1. masukan $IS pada field pertama ber*type (archar dengan length2values 1) ". field ke*" isi dengan nama ber*type (archar dengan length2values #) &. field ke*& isi dengan email bertype (archar dengan length2values #* (. field ke*( isi dengan !onsel ber*type (archar dengan length2values 1) 3. field ke*3 isi dengan alamat ber*type (archar dengan length2values %) 4. field ke*4 isi dengan tm!tlhr ber*type (archar dengan length2values 1* 5. field ke*5 isi dengan tgllhr ber*type date 1. fiel ke*1 isi dengan agama ber*type (archar dengan length values 1) setelah selesai klik tombol Sa(e

selanjutnya bila telah pada halaman seperti digambar maka jadikanlah $IS sebagai primary key, dengan meng*klik i on kun i pada a tion $IS

Membuat Sistem Informasi Akademik Sangat Sederhana dengan PHP MySql bag.+
Pada postingan tutorial kali ini akan di ontohkan sour e ode untuk menampilkan data yang telah di input ke database yang sebelumnya kita telah dibuat: pertama sebelumnya kita buat dulu dokumen koneksidb.!h! simpan di folder SIS yang , sour e odenya : 6Cphp Dlink<m5+LlE onne tI"lo alho+t"J"root"J""K; m5+LlE+ele tEdbI"+mabandung"JDlinkK; C7 setelah itu buat dokumen untuk menampilkan data yang telah dimasukan ke database, simpan dengan nama file menam!ilkan.!h!" sour e ode : 6Cphp in lude "konek+idb,php";

Dtampil<"+ele t * .rom data+i+wa"; Dha+il<m5+LlELuer5IDtampilK; e ho"6bod5 bg olor<Gla=enderG7"; e ho"/a.tar 8i+wa"; e ho"6+t5le t5pe < Gtext/ ++G7 6?44 th { .ont4weight : bold; ba kground4 olor: blue; olor : white; " tr { ba kground4 olor: +il=er; olor: blue; " 447 6/+t5le7"; e ho"6table border<17"; e ho"6tr76th7;o,6/th7 6th7;98 6/th7 6th7;ama 8i+wa 6/th7 6th7(4:ail 6/th7 6th73on+el 6/th7 6th7)lamat 6/th7 6th7@empat Aahir 6/th7 6th7@anggal Aahir 6/th7 6th7)gama6/th76tr7"; Dnomor<1; while IDdata<m5+LlE.et hEarra5IDha+ilKK { e ho "6tr76td7Dnomor6/td7"; e ho "6td7DdataF0H6/td7"; e ho "6td7DdataF1H6/td7"; e ho "6td7DdataF-H6/td7"; e ho "6td7DdataF3H6/td7"; e ho "6td7DdataF4H6/td7"; e ho "6td7DdataF%H6/td7"; e ho "6td7DdataF0H6/td7"; e ho "6td7DdataF1H6/td76/tr7"; DnomorNN; " e ho"6/table7"; e ho "6a hre.<Gindex,htmlG7Oembali6/a7"; e ho "6/bod57"; C7 0Mambar bi+a diperbe+ar dengan double klik pada +etiap gambar Pertama akselah htt!://localhost/SIS/datasis$a.html untuk input data siswa, setelah di klik tombol simpan maka otomatis akan ditampilkan

hasil input data akan ditampilkan seperti berikut :

Membuat Sistem Informasi Akademik Sangat Sederhana dangan PHP MySql bag.*
Pada tutorial lanjutan ini saya akan men ontohkan untuk membuat halaman edit data siswa untuk admin buatlah dokumen dengan naman file in!utsis$aadmin.!h! simpan di folder SIS, 6Cphp e ho "6bod5 bg olor<Gla=enderG7"; e ho "6 enter7"; e ho "6h37 /ata 8i+wa di Palaman )dmin 6/P37"; in lude "konek+idb,php"; Dtampil+i+wa <"+ele t * .rom data+i+wa *B/(B !Q ;98 /(82"; Dha+il < m5+LlELuer5IDtampil+i+waK; Dtotal < m5+LlEnumErow+IDha+ilK; e ho "6+t5le t5pe < Gtext/ ++G7 6?44 td { .ont4weight : bold; ba kground4 olor: la=ender; olor : maroon; " tr { ba kground4 olor: +il=er; olor: blue; " 447 6/+t5le7"; e ho"6table border <17"; e ho"6tr76th7;o,6/th7

6th7;98 6/th7 6th7;ama 8i+wa 6/th7 6th7(4:ail 6/th7 6th73on+el 6/th7 6th7)lamat 6/th7 6th7@empat Aahir 6/th7 6th7@anggal Aahir 6/th7 6th7)gama6/th7 6th7Oeterangan6/th76tr7"; Dnomor<1; while IDdata<m5+LlE.et hEarra5IDha+ilKK { e ho "6tr76td7Dnomor6/td7"; e ho "6td7DdataF0H6/td7"; e ho "6td7DdataF1H6/td7"; e ho "6td7DdataF-H6/td7"; e ho "6td7DdataF3H6/td7"; e ho "6td7DdataF4H6/td7"; e ho "6td7DdataF%H6/td7"; e ho "6td7DdataF0H6/td7"; e ho "6td7DdataF1H6/td7"; e ho "6td76a hre.<.ormedit+i+wa,phpCid<DdataF;98H7(dit6/a7 6a hre.<hap++i+wa,phpCid<DdataF;98H7Papu+6/a76/td76/tr7"; DnomorNN; " e ho "6/table7"; e ho "6/ enter7"; e ho "63 )A9M;<le.t7 @otal /ata 8i+wa :6b7Dtotal6/b76br7"; e ho "6br76 enter76a hre.<data+i+wa,html79nput /ata 8i+wa !aru6/a7"; e ho "6/bod57"; C7

atau

akselah htt!://localhost/SIS/in!utsis$aadmin.!h! maka hasilnya akan seperti berikut : 0gambar bi+a diperbe+ar dengan double klik pada gambar

Membuat Sistem Informasi Akademik Sangat Sederhana dangan PHP MySql bag.,
6utorial di postingan ini lanjutan dari pembuatan halaman edit data siswa oleh admin inputsiswaadmin.php, sekarang akan dibahas untuk membuat fungsi edit dan hapus pada halaman edit data siswa oleh admin, pertama buatlah dokumen P7P dengan nama file formeditsis$a.!h! 6Cphp in lude "konek+idb,php"; Did<DEM(@FGidGH; Dupdate < "+ele t * .rom data+i+wa where ;98 <GDidG"; Dha+il < m5+LlELuer5IDupdateK; Ddata<m5+LlE.et hEarra5IDha+ilK; e ho "6bod5 bg olor<Gla=enderG7"; e ho "6 enter7"; e ho "6h37&orm (dit /ata 8i+wa )dmin6/h37"; e ho "6+t5le t5pe < Gtext/ ++G7 6?44 td { .ont4weight : bold; ba kground4 olor: maroon; olor : white; " tr { ba kground4 olor: +il=er; olor: blue; " 447 6/+t5le7"; e ho"6.orm method < po+t a tion <edit+i+wa,php7"; e ho"6table border <17"; e ho"6tr76td7;98 6/td7 6td7: 6input t5pe < text name<G;98G =alue<GDidG76/td76/tr7 6tr76td7;ama 8i+wa6/td7 6td7: 6input t5pe < text name<nama+i+wa =alue <GDdataFnama+i+waHG76/td76/tr7 6tr76td7(4mail6/td7 6td7: 6input t5pe < text name<email =alue <GDdataFemailHG76/td76/tr7 6tr76td7;o 3on+el6/td7 6td7: 6input t5pe < text name<pon+el =alue <GDdataFpon+elHG76/td76/tr7 6tr76td7)lamat 6/td7 6td7: 6input t5pe < text name <alamat =alue<GDdataFalamatHG76/td76/tr7 6tr76td7@empat lahir 6/td7 6td7: 6input t5pe < text name <tmptlhr =alue<GDdataFtmptlhrHG76/td76/tr7 6tr76td7@anggal Aahir 6/td7 6td7: 6input t5pe < text name <tgllhr =alue<GDdataFtgllhrHG76/td76/tr7

6tr76td7)gama 6/td7 6td7: 6input t5pe < text name <agama =alue<GDdataFagamaHG76/td76/tr7 6td76input t5pe<+ubmit =alue<Bubah7"; e ho "6/bod576/ enter7"; C7 kemudian buat halaman proses pengeditan dengan nama file editsis$a.!h! : 6Cphp in lude "konek+idb,php"; D;98 < DE3*8@FG;98GH; Dnama+i+wa < DE3*8@FGnama+i+waGH; Demail < DE3*8@FGemailGH; Dpon+el < DE3*8@FGpon+elGH; Dalamat < DE3*8@FGalamatGH; Dtmptlhr < DE3*8@FGtmptlhrGH; Dtgllhr < DE3*8@FGtgllhrGH; Dagama < DE3*8@FGagamaGH; Dupdate+i+wa < "update data+i+wa +et nama+i+wa <GDnama+i+waGJ email<GDemailGJ pon+el<GDpon+elGJ alamat <GDalamatGJ tmptlhr < GDtmptlhrGJ tgllhr <GDtgllhrGJ agama < GDagamaG where ;98<GD;98G"; Dha+il+i+wa < m5+LlELuer5IDupdate+i+waK; i. IDha+il+i+waK { headerI"lo ation:input+i+waadmin,php"K; " el+e { e ho "3ro+e+ Rpdate /ata Magal"; " C7 selanjutnya membuat halaman proses untuk penghapusan data, buatlah dokumen dengan nama file h!ssis$a.!h! : 6Cphp in lude "konek+idb,php"; Did<DEM(@FGidGH; Ddeletedata+i+wa < "delete .rom data+i+wa where ;98<GDidG"; Dha+il+i+wa < m5+LlELuer5IDdeletedata+i+waK; i. IDha+il+i+waK

{ headerI"lo ation:input+i+waadmin,php"K; " el+e { e ho "3ro+e+ Papu+ Magal"; " C7 jika dijalankan maka tampilanya akan seperti berikut : pertama akses terlebih dahulu htt!://localhost/SIS/in!utsis$aadmin.!h! di kolom 8eterangan ada fungsi #dit atau 7apus nah sour e dan beberapa dokumen diatas dibuat untuk mengaktifkan fungsi #dit dan 7apus 0gambar bi+a diperbe+ar dengan doubleklik pada +etiap gambar

9ika diklik :ungsi #dit maka akan tampil form edit data namun bila diklik 7apus maka otomatis data akan terhapus.

Anda mungkin juga menyukai