Tworzenie Prostej Platformy Blogerskiej - Edycja Postów

Przez:, Z dnia:

Ten tutorial zakłada, że już ukończyłeś:

  1. Install Ruby on Rails
  2. Create Ruby on Rails application
  3. Create Static Pages - without this deploy will not work
  4. Install Git
  5. Create Remote Git Repository - optional but recommended
  6. Deploy application to Heroku
  7. Manage users with Devise
  8. How to add Twitter Bootstrap to Ruby on Rails application - Advised
  9. Creating Simple Blogging Platform - Creating Model
  10. Creating Simple Blogging Platform - Routes
  11. Creating Simple Blogging Platform - Displaying Posts
  12. Creating Simple Blogging Platform - Building Posts

Jak juz stworzylismy posty, nadszedł czas na nadanie użytkownikom mozliwości edycji tych postów.

Krok 1: Akcja "edit"

Zaczniemy od zdefiniowania akcji w kontrolerze:

app/controllers/posts_controller.rb

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

private

Uzywamy params[:id] tak samo jak wtedy, kiedy szukaliśmy odpowiedniego posta na jego stronę. Jednakże tym razem chcemy się upewnieć, że dostęp do strony edycji posta ma tylko jeg autor.

app/controllers/posts_controller.rb

def edit
   @post = Post.find(params[:id])
   redirect_to posts_path unless @post.user == current_user
end

Krok 2: Stwórz nowy plik HTML

Teraz możemy stworzyć odpowiadający szablon HTML. Wewnątrz folderu posts stwórz nowy plik o nazwie "edit.html.erb". Dodaj poniższy kod:

app/views/posts/edit.html.erb

<%= form_for @post do |f| %>
        <%= render 'shared/error_messages', object: f.object %>
        <div class="form-group">
            <%= f.label :title, class: 'control-label' %>
            <%= f.text_field :title, class: 'form-control' %>
        </div>

        <div class="form-group>
            <%= f.label :body, class: 'control-label' %>
            <%= f.text_area :body, class: 'form-control', rows: 6 %>
        </div>

        <%= f.submit 'Save', class: 'btn btn-primary %>
<% end %>

Prawdopodobnie zauważyłeś, że formularz jest identyczny jak ten w pliku new.html.erb. Chcemy utrzymać nasz kod zgodnie z zasadą DRY (don't repeat yourself, nie powtarzaj się). Wyciągniemy ten formularz i umieścimy w "partial", który później będziemy mogli zrenderować na obu stronach. W app/views/posts/ stwórz nowy plik i nazwij go "_form.html.erb".

app/views/posts/_form.html.erb

<%= form_for post do |f| %>
        <%= render 'shared/error_messages', object: f.object %>
        <div class="form-group">
            <%= f.label :title, class: 'control-label' %>
            <%= f.text_field :title, class: 'form-control' %>
        </div>

        <div class="form-group>
            <%= f.label :body, class: 'control-label' %>
            <%= f.text_area :body, class: 'form-control', rows: 6 %>
        </div>

        <%= f.submit 'Save', class: 'btn btn-primary' %>
<% end %>

Upewnij się, że zmieniłeś "@post" na "post".

Krok 3: Zastąp stare formularze nowymi plikami

Teraz możemy zastąpić stare formularze i dodać jedną linijkę, która zredneruje "partial":

app/views/posts/new.html.erb

<h1>New Post</h1>
<%= render 'form', post: @post %>

app/views/posts/edit.html.erb

<h1>Edit post</h1>
<p><%= link_to 'back', post_path(@post) %></p>
<%= render 'form', post: @post %>

Dodajmy też link do stroy edycji w szablonie "show". W tagu h1, od linii 3 do 5.

app/views/posts/show.html.erb

<h1>
        <%= @post.title %>
        <% if @post.user == current_user %>
            <small><%= link_to 'edit', edit_post_path(@post) %></small>
        <% end %>
</h1>
<p><small><strong>By: </strong><%= @post.user.email %></small></p>
<p><%= @post.body %></p>

Możemy dodać ten kod używając bardziej zwięzłej i krótszej wersji dzięki content_tag. Wydaje mi się jednak, że na początek może być to trochę niejasne.

app/views/posts/show.html.erb

<h1><%= @post.title %> <%= content_tag(:small, link_to('edit', edit_post_path(@post))) if @post.user == current_user %></h1>
<p><small><strong>By: </strong><%= @post.user.email %></small></p>
<p><%= @post.body %></p>

Krok 4: Akcja "update"

Prawie skończylismy. Jednakże, nie możemy jeszcze zapisać zmian wysłanych z formularza edycji posta. By tego dokonać użyjemy akcji "update".

W kontrolerze postów:

/app/controllers/posts_controller.rb


class PostsController < ApplicationController
# existing code

def update
        @post = Post.find(params[:id])
        if @post.user == current_user
            if @post.update_attributes(allowed_params)
                flash[:success] = "Updated post"
                redirect_to @post
            else
                render 'edit'
            end
        else
            redirect_to posts_path
            flash[:notice] = "You can't to this"
        end
end


private
        def allowed_params
            params.require(:post).permit(:title, :body)
        end
end

Jak widzisz kod jest podobny do tego z akcji "create", jednak tym razem musimy sprawdzić czy autorem posta jest current_user. Ponadto, zamiast budowania nowego posta, robimy update_attributes.

Zauważ, że zarówno akcja "create" jak i "update" nie mają własnych szablonów HTML. Zwyczajnie przekierowujemy użytkownika po skończonej pracy.

Śmiało, pobaw się tym kodem trochę.

Usuwanie postów

Musisz się zalogować by móc oznaczyć tutorial jako ukończony żeby śledzić swój postęp



Komentarze

  • Z dnia: nate napisał:

    There is a missing '

    app/views/posts/edit.html.erb

    <%= f.submit 'Save', class: 'btn btn-primary %>

  • Z dnia: nate napisał:

    app/views/posts/_form.html.erb is missing "

Dodaj komentarz

Możesz się zalogować by skomentować