Seri Belajar Ruby on Rails Bagian 12 - Menambahkan Sub Category pada category

Di dalam seri ini kita masih akan melanjutkan project yang telah kita buat di Seri Belajar Ruby on Rails Bagian 11. Jadi, untuk kalian yang sudah tidak menyimpan project Homework Management silahkan download contoh aplikasi di link berikut [Download]

Sebelum memulai, pastikan kembali project Homework Management yang telah dibuat berjalan dengan baik. Jika sudah pasti, let’s begin !

Membuat CRUD sub_category

Seperti biasa, kita buka terminal dan kita jalankan code berikut:

$ rails g scaffold sub_category name:string category_id:integer

$ rake db:migrate

Dengan menjalankan code tersebut, kita telah membuat CRUD untuk sub_category, dan melakukan migrasi ke database.

Langkah berikutnya kita tambahkan validasi dan relasi di model sub_category :

Sesudah menambahkan validasi dan relasi di model sub_category, kita perlu menambahkan relasi juga di model category :

Setelah menambahkan relasi di model category, kita tambahkan script berikut pada controller sub_categories_controller :

1. Tambahkan method ini pada bagian atas sub_categories_controller :
2. Tambahkan method berikut pada bagian private sub_categories_controller :

Modifikasi Views sub_category

Kita ubah terlebih dahulu file app/views/sub_categories/_form.html.erb menjadi :

Kita ubah juga file app/views/sub_categories/show.html.erb menjadi :

Dan yang paling penting, kita ubah file app/views/sub_categories/index.html.erb menjadi :

Dengan mengubah ketiga file tersebut, kita lanjutkan dengan mencoba mengisi data sub_category. Jalankan code berikut:

$ rails s

Buka url http://localhost:3000/sub_categories/new di browser, lalu kita coba membuat satu data baru di sub_category. Kita isikan "Beginner 1" pada kolom name dan pilih "Bahasa Inggris" sebagai category nya. Klik create sub category untuk menyimpan.

Halaman Show Sub_Category

Jika berhasil menyimpan data, maka browser anda akan menampilkan :

Halaman Show Sub_Category

Menambahkan data sub_category

Agar pengimplementasian pembuatan dropdown list ini lebih dapat dipahami, kita perlu menambahkan banyak data di sub_category. Tambahkan data sub_category berikut berdasarkan category masing-masing :

Data Sub_Category

Setelah selesai menambahkan data-data yang ada pada gambar, kita pun dapat menambahkan data sub_category lebih banyak lagi, sesuai dengan keinginan kita.

Modifikasi CRUD Homework

Sebelum mengubah script yang ada pada CRUD homework, kita terlebih dahulu menambahkan atribut sub_category_id kedalam struktur homework dengan cara menjalankan code berikut di terminal.

$ rails g migration AddSubCategoryIdToHomework

Buka file migration tersebut yang ada pada folder db/migrate,dan tambahkan script berikut :

Lakukan migrasi dengan menjalankan code berikut di terminal :

$ rake db:migrate

Kita buat relasi baru di model homework, dengan menambahkan script berikut :

Selanjutnya kita ubah controller homeworks_controller menjadi seperti berikut :

Lalu kita lanjutkan dengan mengubah script app/views/homeworks/index.html.erb menjadi :

Dan kita ubah juga script yang ada pada app/views/homeworks/show.html.erb menjadi :

Setelah mengubah index dan show pada homework. Maka kita teruskan dengan mengubah script yang ada pada app/views/homeworks/_form.html.erb menjadi :

Dengan menjalankan http://localhost:3000/homeworks/new di browser, dapat terlihat di dalam form terdapat dua buah dropdown list. Namun dropdown list tersebut tidak saling terikat. Data pada dropdown list sub_category tidak dipengaruhi nilai dari dropdown list category.

so, congratulations !! anda telah berhasil membuat dropdown sub-category