Latest Article

Promotion Ads

Buat Website Murah

Featured Article

Popular Article

Membuat Table Data Mahasiswa (PHP)

Setelah saya menuliskan beberapa tutorial tentang pembelajaran PHP hingga sampai saat ini Tutorial PHP hanya sampai pada pembahasan Array. Karena masih banyak yang bingung, maka dari itu sebelum saya melanjutkan penulisan Tutorial PHP ini, saya tekankan agar membaca ulang & mencoba mempraktekkannya membuat sebuah script PHP sederhana seperti Kalkulator, Pendaftaran Online & Table Data Mahasiswa.

Kali ini saya akan memberikan sebuah praktek sederhana tentang pembuatan Table Data Mahasiswa dengan menggunakan Tipe Data Array & Perulangan Foreach. Pertama-tama, anda siapkan dulu text editor favorite anda & lanjutkan mengetikkan kode satu-persatu karena saya tidak memberikan sourcenya, melainkan hanya screenshot scriptnya saja.

Pertama-tama, buatlah script PHP dibawah ini yang berisikan tipe data array & perulangan foreach.

Script PHP Table Data Mahasiswa

Kedua, implementasikan script PHP tersebut ke dalam HTML dengan struktur table berikut ini.

Script HTML Table Data Mahasiswa

Langkah terakhir, buatlah CSS Styling untuk Table tadi dengan menyisipkan CSS Internal kedalam HTML.

<style type="text/css">
table {
    *border-collapse: collapse; /* IE7 and lower */
    border-spacing: 0;
    width: 100%;    
}
.zebra td, .zebra th {
    padding: 10px;
    border-bottom: 1px solid #f2f2f2;    
}
.zebra tbody tr:nth-child(even) {
    background: #f5f5f5;
    -webkit-box-shadow: 0 1px 0 rgba(255,255,255,.8) inset; 
    -moz-box-shadow:0 1px 0 rgba(255,255,255,.8) inset;  
    box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;        
}
.zebra th {
    text-align: left;
    text-shadow: 0 1px 0 rgba(255,255,255,.5); 
    border-bottom: 1px solid #ccc;
    background-color: #eee;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#eee));
    background-image: -webkit-linear-gradient(top, #f5f5f5, #eee);
    background-image:    -moz-linear-gradient(top, #f5f5f5, #eee);
    background-image:     -ms-linear-gradient(top, #f5f5f5, #eee);
    background-image:      -o-linear-gradient(top, #f5f5f5, #eee); 
    background-image:         linear-gradient(top, #f5f5f5, #eee);
}
.zebra th:first-child {
    -moz-border-radius: 6px 0 0 0;
    -webkit-border-radius: 6px 0 0 0;
    border-radius: 6px 0 0 0;  
}
.zebra th:last-child {
    -moz-border-radius: 0 6px 0 0;
    -webkit-border-radius: 0 6px 0 0;
    border-radius: 0 6px 0 0;
}
.zebra th:only-child{
    -moz-border-radius: 6px 6px 0 0;
    -webkit-border-radius: 6px 6px 0 0;
    border-radius: 6px 6px 0 0;
}
.zebra tfoot td {
    border-bottom: 0;
    border-top: 1px solid #fff;
    background-color: #f1f1f1;  
}
.zebra tfoot td:first-child {
    -moz-border-radius: 0 0 0 6px;
    -webkit-border-radius: 0 0 0 6px;
    border-radius: 0 0 0 6px;
}
.zebra tfoot td:last-child {
    -moz-border-radius: 0 0 6px 0;
    -webkit-border-radius: 0 0 6px 0;
    border-radius: 0 0 6px 0;
}
.zebra tfoot td:only-child{
    -moz-border-radius: 0 0 6px 6px;
    -webkit-border-radius: 0 0 6px 6px
    border-radius: 0 0 6px 6px
}
</style>

Setelah semuanya selesai, bungkus Script PHP, HTML, CSS diatas dalam satu dokumen HTML dengan nama mahasiswa.php. Kemudian jalankan di web server anda. Untuk merubah Data Mahasiswanya, anda tinggal merubah nama, alamat, dll dalam Array di Script PHP diatas. Demikianlah tulisan ini yang sengaja dibuat ribet agar kalian bisa berusaha memperbaikinya sendiri. Selamat berjuang kawan :D

Created By :        Date : 11 - November - 2013

Jasa Pembuatan Website

8 Comments

  1. Intan SudibjoReply

    perlu kursus ke mas Imam, kalo memang pengen paham PHP :D

    • Nurul ImamReply

      Ga perlu kursus mas, asal mau baca artikel tentang PHP yang ada di internet, insya allah paham mas :)

  2. BlogS oF HariyantoReply

    para mahasiswa harus mampir ke blog super ini buat belajar membuat table…..nice share information sobat :-)

    • Nurul ImamReply

      Para dosennya seharusnya bikin tutorial dokumentasi biar mahasiswanya mudah memperoleh informasi.

  3. Cara RirinReply

    Kalau dosen memang harus bisa membuat tabel seperti ini. Secara getu mahasiswa sekarang pinter-pinter. Jadi dosen nya harus lebih pinter ya pak mas guru ^^

    • Nurul ImamReply

      Iya donk, masa iya dosennya kalah pinter sama mahasiswanya…
      Mau ditaro dimana tuh muka dosen hehehe

  4. rafkyReply

    klu login gimana mas???

  5. mustakimReply

    Mas nurul bisa buat aplikasi yg terhubung secara online mengenai evaluasi dan monitoring APBD ATAU APBN bisa dibantu, dan kira kira biayanya berapa ya.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>