Komponen pertama dari framework MVC adalah Model. Posting berikut ini menjelaskan bagaimana menyiapkan model sehingga nanti dapat digunakan oleh komponen MVC lainnya yaitu komponen Viewer dan Controller. Sebagai contoh kasus adalah membuat aplikasi untuk mengelola pegawai. Model yang akan dibuat bertujuan atau berfungsi sebagai Data Access Layer yang secara sederhana mempunyai artinya sebagai model untuk mengakses database dan melakukan operasi pada data yang ada pada tabel-tabel di dalamnya. Operasi yang umum dilakukan adalah CRUD, create-retrieve-update-delete.
{Menyiapkan Database & Table}
Untuk membuat aplikasi untuk mengelola pegawai, maka diperlukan database yang akan menyimpan data. Data yang akan dikelola pada aplikasi ini adalah divisi dan pegawai, sehingga database harus berisi dua tabel untuk menyimpan kedua data tersebut.
Pada aplikasi ini digunakan database SQL Express Edition, maka mesti dipastikan SQL Express Edition telah diinstall sebelum mengikuti langkah ini. Dengan menggunakan SQL Express Edition sebagai database yang digunakan pada pembangunan aplikasi ini, maka file database dapat disimpan dalam folder yang ada pada project. Sehingga project dalam dijalankan pada mesin lain yang telah memiliki SQL Express Edition.
Langkah pertama yang dilakukan adalah membuat folder untuk menyimpan file database tersebut. Penamaan folder ini harus mengikuti aturan yang dimiliki oleh ASP.NET. Langkah pertama untuk membuat folder ini adalah klik kanan pada project yang telah dibuat di atas, kemudian pilih Add > Add ASP.NET Folder > App_Data. Folder App_Data adalah folder yang umumnya digunakan untuk menyimpan file data dengan format *.mdf (file SQL Server Express) atau *.xml.
Langkah kedua adalah menambahkan SQL Server Database ke dalam folder App_Data dengan cara klik kanan pada folder App_Data kemudian pilih Add > New Item. Pada window Add New Item pilih Visual C# > Data > SQL Server Database dan pada kolom input Name berikan nilai PegawaiDB.mdf sebagai nama database, kemudian klik tombol Add.
Maka dapat dilihat file PegawaiDB.mdf pada Solution Explorer seperti pada gambar di bawah ini.
Setelah database dibuat maka langkah selanjutnya adalah membuat tabel. Pada Visual Studio telah dilengkapi fitur sebagai tool pengelolaan database. Maka pada langkah ketiga dimulai dengan mengaktifkan tool tersebut dengan cara mengklik double pada file PegawaiDB.mdf. Jika SQL Server Express maka tool ini dapat dilihat pada area Server Explorer seperti gambar di bawah ini.
Untuk menambah tabel pada database PegawaiDB.mdf dapat dilakukan dengan cara klik kanan pada folder Tables kemudian pilih Add New Table, maka akan ditampilkan seperti pada gambar berikut.
Buat field-field untuk tabel Divisi seperti pada contoh di atas, kemudian pada area T-SQL ubah nama tabel dengan nama Divisi. Untuk membuat tabel sesuai dengan desain yang telah dibuat, klik tombol Update yang ada pada posisi kiri atas.
Setelah tabel Divisi berhasil dibuat, maka dilanjutkan dengan membuat tabel Pegawai dengan nama field seperti pada gambar di bawah ini.
Pada tabel ini perlu dibuat foreign key yang menjadi relasi ke tabel Divisi. Foreign key pada tabel Pegawai adalah DivisiID, untuk membuat foreign key ini dapat dilakukan dengan cara klik kanan pada Foreign Key kemudian pilih Add New Foreign Key kemudian pada T-SQL akan ditambahkan baris baru dengan awalan CONSTRAINT. Ubah baris baru tersebut menjadi seperti pada gambar di atas. Setelah nama tabel pada T-SQL diganti dengan nama Pegawai, klik tombol Update.
Jika proses pembuatan kedua tabel itu sukses akan dapat dilihat tabel Divisi dan Pegawai di dalam database PegawaiDB.mdf.
Selanjutnya dapat dilakukan pengisian data awal pada kedua tabel tersebut. Untuk tabel Divisi, pengisian data awal dapat dilakukan dengan klik kanan pada tabel Divisi kemudian pilih Show Table Data.
Isi record pada tabel ini dengan nilai-nilai seperti pada gambar di bawah ini. Untuk mengisi data ini dapat dilakuan dengan cara seperti mengisi nilai-nilai dengan menggunakan MS Excel.
Dengan cara yang sama, lakukan pengisian data pada tabel Pegawai dengan nilai seperti pada gambar berikut.
{Jenis Model}
Komponen model dapat dibedakan menjadi 2 jenis, yaitu:
- Model Data Access Layer, class model yang dibuat dengan menggunakan bantuan tool Entity Framework. Komponen model ini juga akan berfungsi sebagai Data Access Layer, yang berisi method-method untuk memudahkan dalam melakukan operasi database seperti melakukan koneksi dan operasi CRUD (create, retrieve, update, delete).
- Model ViewModel, class model yang dibuat secara manual, class ini akan dibuat untuk membantu membuat antarmuka sesuai dengan kebutuhan.
{Model Data Access Layer}
Pada bagian ini akan ditunjukkan membuat model yang akan berfungsi sebagai Data Access Layer dengan bantuan Entity Framework. Sebagai informasi, Data Access Layer yang dibuat dengan Entity Framework dapat dibedakan menjadi dua konsep, yaitu:
- Code First, konsep ini dimulai dengan membuat class context dan model terlebih dahulu. Saat aplikasi dijalan pertama kali maka akan secara otomatis akan membuat database dan tabel-tabel sesuai dengan model yang telah dibuat.
- Database First, konsep ini dimulai dengan membuat database dan tabel-tabel yang diperlukan terlebih dahulu. Kemudian class context dan class model akan dibuat secara otomatis dengan bantuan generator pada Entity Framework.
Pada posting ini akan dibahas pembuatan model dengan konsep yang kedua, dimana telah dibuat database dan tabel-tabel untuk keperluan pembuatan aplikasi pengelolaan pegawai.
Seperti class model yang sebelumnya telah dibuat, class model ini juga harus disimpan pada folder Models. Maka langkah pertama yang dilakukan adalah dengan klik kanan pada folder Models kemudian pilih Add > New Item.
Pada window Add New Item, pilih Visual C# > Data > ADO.NET Entity Data Model. Kemudian pada kolom input Name isikan nilai PegawaiModel. Kemudian akan ditampilkan window Entity Data Model Wizard..
Karena akan digunakan konsep Database First, maka dipilih EF Designer from database kemudian klik tombol Next.
Pada window di atas dapat dipilih PegawaiDB.mdf sebagai database yang akan digunakan sebagai acuan membuat class context dan class model. Pada bagian ini, secara otomatis akan dibuatkan connection string dengan nama PegawaiDBEntities pada Web.Config. Kemudian klik tombol Next.
Pilih seluruh tabel dengan cara dicentang, kemudian klik tombol Finish. Jika semua proses yang telah dilakukan di atas berhasil, maka akan dapat dilihat hasilnya seperti gambar di bawah ini.
Pada gambar di atas dapat dilihat pada folder Models terdapat file hasil pembuatan secara otomatis yaitu PegawaiModel.edmx. Sedangkan setiap tabel yang telah dipilih akan dibuatkan masing-masing sebuah class model. Untuk tabel Divisi akan dibuat class Divisi yang disimpan pada file Divisi.cs. Sedangkan tabel Pegawai akan dibuatkan class Pegawai yang disimpan pada file Pegawai.cs dengan isi sebagai berikut.
Penggunaan class context dan class model akan dijelaskan pada pembahasan tentang komponen controller dan view pada posting selanjutnya.
{Model ViewModel}
Istilah view model diberikan kepada class model yang berfungsi sebagai mengatur tampilkan pada halaman view.
Sebagai contoh untuk data Pegawai, telah dibuat class model Pegawai seperti yang dilihat pada diagram berikut.
Dengan property-property tersebut maka akan ditampilkan data seperti tabel berikut ini.
Pada data tersebut dapat dilihat terdapat field DivisiID dengan nilai untuk masing-masing record yang berisi nilai berupa angka yang sesuai dengan primary key pada data Divisi.
Jika pada aplikasi ditampilkan data pegawai seperti pada gambar di atas, maka informasi yang disampaikan kepada pengguna menjadi kurang lengkap. Akan lebih bagus jika data yang ditampilkan pada halaman aplikasi seperti berikut ini.
Untuk menampilkan data seperti itu maka perlu dibuat model yang sesuai antarmuka untuk menampilkan data di atas.
Cara untuk membuat class model ini dapat dimulai dengan klik kanna pada folder Models, kemudian pilih Add > Class. Kemudian pilih Visual C# > Class dan pada kolom input Name isikan nilai PegawaiViewModel.cs. Penambahan kata “ViewModel” pada nama class model sering digunakan untuk menandakan bahwa class tersebut berfungsi sebagai sarana untuk mengirimkan data dan tampilan sesuai dengan keinginan.
Berikut ini adalah isi dari file PegawaiViewModel.cs, pada class ini terdapat property dengan nama NamaDivisi yang akan berfungsi untuk menyimpan data nama divisi.
Nah sekarang terdapat dua jenis model yang telah dibuat dan siap digunakan oleh komponen View dan Controller. Pembahasan tentang pemanfaatan model-model tersebut akan dibahas pada posting selanjutnya.
gan cara buat metode create gmana y ?? pas baca dr database bsa, cma pas mu create bngung koding nya.. nhun..
mungkin bisa dibaca di sini https://play.google.com/store/books/details/M_Reza_Faisal_Seri_Belajar_ASP_NET_ASP_NET_MVC_Unt?id=4vPzDQAAQBAJ&hl=en. semuanya sudah lengkap dijelaskan.
terima kasih
Pak reza, mau tanya
kalau membatasi new record…berdasarkan master detail
saya membuat CRUD master order dan order detail..
pada order detail saya batasi menggunakan create order detail nya berdasarkan value yang sudah saya siapkan di master detail order..
misal nya : di master detail saya siapkan jumlah 10, maka pada order detail saya hanya bisa create 10
Terimakasih
untuk kasus itu sepertinya bisa dilakukan pengecekan di sisi peprograman, setiap data itu ditampilkan juga dicek jumlah order detailnya. jika jumlah order detailnya = 10 maka tombol tambah order detail dihilangkan/disembunyikan.
Terimakasih atas masukannya Pak Reza
Apakah pak reza ada sample code untuk kasus seperti ini, mohon pencerahannya pak
Terimakasih
belum ada :)
Pak Reza, salah satu akun untuk login di aplikasi ini apa ya ?
Saya masih benar” awam untuk asp.net dan mvc
Terima Kasih
saya lupa nama user dan passwordnya. biasanya saya pakai user admin, password a
Pak Reyza, saya sudah beli ebook ini tetapi ada yang penjelasannya kurang lengkap, di view latihan.cshtml
saat button batal di klik hanya textbox nama yang isinya ke reset.
textarea, dropdown, listbox, radiobutton, checkbox isinya tidak terkena reset.
mungkin ada solusi yang bisa pak reyza berikan agar semua isi field bisa di reset saat di klik batal
Terima kasih
buku yg mysql atau postgresql mas?
klu saya pakai databasenya MySQL pak
ini judul buku yang saya maksud
“Seri Belajar ASP.NET MVC Untuk Pemula”
kalau ASP.NET MVC Untuk Pemula saya menggunakan database SQL Server. Nanti akan saya cek ya kodenya. Atau mungkin mas cek contoh di sini https://github.com/rezafaisal/ASPNETCoreMySQL itu menggunakan database MySQL
klu untuk mengikuti ebook ini saya menggunakan sqlserver pak,
belum saya coba ke mysql
kendalanya yang saya maksud sih sebenarnya cuma di sini pak
di view latihan.cshtml
saat button batal di klik hanya textbox nama yang isinya ke reset.
textarea, dropdown, listbox, radiobutton, checkbox isinya tidak terkena reset.
kalau begitu tinggal bikin saja method action untuk tombol reset, yang tugasnya untuk menghilangkan isi dari textarea dll yg telah diisi sebelumnya.
oke terima kasih pak
selain itu masih ada yang mau saya tanyakan lg pak mulai dari hal 143 dst.
karna penejelasanya tidak sedetail sebelumnya
klu pak reyza berkenan saya ingin menanyakan lsng lwt email saja pak
biar saya bisa kasih liat ss nya jg di bagian yang tidak bisa dalam buku tutorial
Terima Kasih
silakan via email. emailnya ada di buku itu :)
Pak Reyza untuk halaman 143 di dalam ebook ini “Seri Belajar ASP.NET MVC Untuk Pemula”
kurang jelas pak letak yang ada
saya agak kebingungan bagaimana cara menambahkan script tp saya tidak tau letak
mohon penjelasannya pak
Terima Kasih
boleh tau lanjutan dari potingan ini? hehe saya ingin tahu bagaimana cara menampilkan model tersebut kedalam modelnya dan mengatur controllernya. terimakasih
Silakan baca ebook yg saya sudah tulis saja, di sana lengkap
Bagus, belajar lagi nah. Terima kasih lah.