User dapat mulai membuat ide

setelah user berhasil melakukan login maka barulah kita mulai tujuan utama dari aplikasi ini yaitu user dapat mulai mengirimkan ide-idenya, untuk praktek ini akan kita gabungkan mulai dari langkah membuat model, membuat controller, mengatur tampilan di view dan mengatur link-link utama, harus dipastikan pula hanya user yang telah login yang dapat membuat ide baru

Membuat idea

Membuat model idea

  • klik start, ketik command , klik command prompt with ruby
  • cd intomyidea
  • membuat model idea, ketik
    • rails generate model Idea
    • perlu diingat nama model gunakan huruf beser
  • jalankan program sublime.
    • pilih menu file, open folder dan pilih c:\sites\intomyidea
    • pada kotak browser di sebelah kiri buka folder db\migrate\
    • pilih file .... create_ideas.rb
    • hapus seluruh isinya dan ganti dengan kode berikut:
class CreateIdeas < ActiveRecord::Migration
  def change
    create_table :ideas do |t|
      t.string :title
      t.text   :notes
      t.references :user, index: true
      t.timestamps null: false
    end
    add_index :ideas, :title
    add_index :ideas, :notes
  end
end
  • simpan dengan ctrl + S
    • kembali ke command prompt dan buat tabel idea dengan perintah
  • rake db:migrate

penjelasan tabel ide dan langkah pertama dalam membuat One to Many relationship

  • seperti dijelaskan pada modul 2 di pelajaran ini, di dalam tabel idea akan hanya ada kolom judul dan notes dimana judul digunakan untuk memasukan judul sedangkan notes digunakan untuk memasukkan detil ide yang diberikan
  • reference user ini adalah hal baru dimana kita akan membuat suatu relation-ship antar tabel dimana hubungan antara tabel user dan tabel ide adalah "One To Many", di mana satu user bisa memiliki beberapa ide
  • untuk mewujudkan suatu hubungan "One to Many" maka langkah pertama adalah memberikan 1 kolom dengan tipe reference pada tabel ide

langkah 2: memberikan catatan pada model user dan idea

  • buka tabel user di /app/models/user.rb
    • tambahkan kalimat berikut dibawah tulisan class
  has_many :ideas
  • buka tabel user di /app/models/idea.rb
    • hapus semua isinya dan ganti dengan tulisan berikut
class Idea < ActiveRecord::Base
# relation
  belongs_to :user

# validation
  validates :title, 
    :presence => { message: 'harus ada'},
    length: { in: 4..100 , message: 'minimal 4 huruf dan maximal 100' }
end

membuat Controller idea

  • kembali ke command prompt with ruby
  • pastikan berada di dalam folder intomyidea
  • membuat controller idea, ketik 
    rails generate controller ideas new create index show edit update destroy
  • buka file app/controllers/ideas_controller.rb
    • hapus seluruh isinya dan lakukan copy-paste blok program dibawah ini
  class ideasController < ApplicationController

    def new
      @idea = idea.new
    end

    def create
      @idea = idea.new(idea_params)
      @idea.user = current_user
      if @idea.save
        flash[:success] = 'Proses pendaftaran sukses'
        redirect_to ideas_path
      else
        render 'new'
      end
    end

    def show
      @idea = idea.find(params[:id])
    end

    def index
      @search = idea.search(params[:q])
      @ideas = @search.result.order('created_at DESC').paginate(page:params[:page],per_page:10)
    end

    def edit
      @idea = idea.find(params[:id])
    end

    def update
      @idea = idea.find(params[:id])
      if @idea.update_attributes(idea_params)
        flash[:success] = 'Perubahaan anda berhasil disimpan'
        redirect_to ideas_path
      else
        flash[:error] = @idea.errors.full_messages[0]
        redirect_to edit_idea_path
      end
    end

    def destroy
      @idea = idea.find(params[:id])
      @idea.destroy
      flash[:success] = 'Data berhasil dihapus'
      redirect_to ideas_path    
    end

  private

    def idea_params
      params.require(:idea).permit(
        :title, 
        :notes, 
        :user_id
        )
    end

  end

mengubah routes

  • buka file /config/routes.rb
    • tambahkan dibawah tulisan resources ideas
  resources :ideas

membuat tampilan untuk memasukkan data idea

  • buka file app/views/ideas/new.html.erb
    • hapus seluruh isinya dan lakukan copy-paste blok program dibawah ini
  <% if logged_in? %>
    <%= render 'idea_form' %>
  <% else %>
    <%= flash[:danger] = 'maaf anda harus login dulu' %>
  <% end %>

membuat file partial form idea

  • buat file baru dengan menekan ctrl + n
  • tekan ctrl + s dan simpan di app/views/ideas/_idea_form.html.erb
    • lakukan copy-paste blok program dibawah ini
<%= form_for @idea do |f| %>
  <%= render 'common/form_errors', object: @idea %>

  <h3>
    <%= f.label :title, "Judul" %><br>
    <%= f.text_field :title, :size => 50 %>
  </h3>

  <h3>
    <%= f.label :notes, "Penjelasan detil" %><br>
    <%= f.text_area :notes, :rows => 4, :cols => 50 %>
  </h3>

  <%= f.submit "Submit", class: "btn btn-info login-box-button" %>
<% end %>

membuat tampilan seluruh idea

  • pada sublime, buka file app/views/ideas/index.html.erb
    • hapus isinya dan ganti dengan ketikan berikut
<% if @ideas.any? %>
     <table class="table table-striped">
      <thead>
        <tr>
          <th><%= "User" %></th>
          <th><%= "Idea" %></th>
          <th><%= "Detail" %></th>
          <th> </th>
        </tr>
      </thead>
      <tbody>
          <%= render @ideas %>
      </tbody>
    </table>
  <div  class="digg_pagination">
      <%= will_paginate %>
  </div>
<% else %>
  <p>Maaf, Tidak ada data idea </p>
<% end %>
  • pada program diatas arti kata-kata render @ideas
  • karena itu tekan Ctrl + N untuk membuat dokumen baru,
    • tekan Ctrl + S, simpan di folder app/views/ideas/ _idea.html.erb
    • (awas jangan lupa tanda underscore yang ada di awal)
  • lakukan copy, paste pada ketikan dibawah ini.
  <tr>
    <td><%= idea.user.username %></td>   
    <td><%= idea.title %></td>
    <td><%= idea.notes %></td>
  </tr>

menambahkan link untuk membuat ide baru dan menampilkan semua ide

  • buka file app/views/layouts/application.html.erb
    • sisipkan perintah ini dibawah pilihan menu change password
  <li><%= link_to "New idea", new_idea_path %></li>
  • buka file config/routes.rb
    • ubah baris root_path menjadi seperti berikut
  root to: 'ideas#index'
  • simpan dengan Ctrl + S, dan buka browser, serta ketik localhost:3000
    • lakukan login
    • setelah login, cobalah untuk membuat 2 ide baru