Tutorial Cara Menampilkan Data Dinamis Kedalam Modal Bootstrap

September 28, 2016 / Diposting Oleh TondanoWeb.com / PHP


Kali ini akan membahas Tutorial Cara Menampilkan Data Dinamis Kedalam Modal Bootstrap.

Dikalangan Web Programmer, PHP dan Bootstrap sudah bukan sesuatu yang asing lagi.  PHP diibaratkan sebuah mesin sedangkan Bootstrap untuk kebutuhan casing serta tampilannya agar terlihat tidak kaku.

Dalam tutorial kali ini kita akan membuat sesuatu yang gak spesial-spesial amat yaitu menampilkan data yang di ambil dari Database kemudian di tampilkan ke dalam Modal Bootstrap.

Baca Juga 

Oke, gak usah banyak basa-basi kita langsung saja ke pokok permasalahan.

Langkah Pertama sobat buat dulu sebuah database, terserah apa namanya kemudian buat sebuah table dengan nama table “barang” atau copy saja script dibawah ini :





Kemudian sobat insert-kan value atau data ke dalam tabel tersebut :

Setelah struktur database dibuat, selanjutnya kita masuk ke dalam pengolahan data.

Atau silahkan mendownload databasenya disini.

Kemudian langkah ketiga, sobat buat satu file dan beri nama bootstrap.php lalu sobat pastekan script dibawah ini ke dalam file tersebut. Dalam hal ini, terlebih dulu kita akan menampillkan data ke dalam tabel.

Jika semuanya berjalan lancar, hasilnya akan seperti screenshot dibawah ini :

bootstrap1

Langkah keempat, kita akan menampilkan data ke dalam modal, ketika tombol detail di klik maka akan muncul tampilan modal beserta data yang diambil dari database berdasarkan id.





Dalam hal ini sobat buat lagi satu buah file dan beri nama detail.php kemudian sobat paste-kan script dibawah ini :

Setelah langkah-langkah diatas selesai, kemudian sobat jalankan file bootstrap.php

Dan sekali lagi jika semuanya berjalan lancar maka hasilnya akan seperti screenshot dibawah ini.

bootstrap2

 

Sekian artikel tutorial untuk kali ini, jika sobat memiliki kesulitan, pertanyaan ataupun kritikan silahkan menghubungi kami melalui form komentar dibawah.





Baca Juga :


Tags: , , , , , , , ,

  • Pingback: Tutorial Membuat Form Serta Melakukan Edit/Update Data Dinamis di Dalam Modal Bootstrap - TondanoWeb.com()

  • febri ramadani

    #ask
    kalau datanya ga keluar gimana gan ?
    koneksinya udah benar, dan rownya kebaca ad 5 buah data.

    • braiser

      gak bisa keluar gimana gan @febri_ramadani:disqus ?
      sorry baru sempat baca komennya..

  • andri suryono

    #ask
    mau tanya pak,, saya bisa muncul,, tapi untuk pagination page kedua kenapa gk bisa muncul ya..
    saya pake data tables..
    minta solusinya yak

  • muhammad ikhsan

    kalau idnya type datanya vharcar gk bisa ya?

  • dika

    Ada kesalahan di detail.php dengan kesalahannya “Invalid argument supplied for foreach()”

    • braiser

      scriptnya sudah sesuai dengan yang diatas ?

      • dika

        Saya mencobanya dengan kasus lain, apakah bisa modal detail itu menampilkan seluruh isi tabel

        • TondanoWeb.com

          bisa, tinggal menyesuaikan saja dengan kebutuhan, apa saja yang akan di tampilkan.
          Tapi jika ukuran tablenya besar dan memiliki banyak kolom, berarti css modalnya harus dicustomisasi lagi, diperbesar ukurannnya menyesuikan dengan ukuran tabel.

    • mhmdawaludin

      benar, saya juga memliki masalah yang sama.