Skip to content

Ajaxify movies - Added the editability functionality to each row, as well as deleting movies. #14

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
WillSchwieder wants to merge 10 commits into
base: main
Choose a base branch
from
Open

Ajaxify movies - Added the editability functionality to each row, as well as deleting movies. #14

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
d004bed
Added the fields at the top, reformatted page to target
WillSchwieder May 3, 2022
7bc169f
Set up the form_with for the new movie form
WillSchwieder May 3, 2022
0718e1d
Got the create to work, need to get the JS to work
WillSchwieder May 3, 2022
962c777
New movie form working and editing title
WillSchwieder May 3, 2022
9e2fecf
The fields clear after a new record is added
WillSchwieder May 3, 2022
2c0fcec
User can edit the entire line for movie details
WillSchwieder May 3, 2022
4902b4c
Should have all of the functionality in now.
WillSchwieder May 3, 2022
470407f
Added fk constraint to movies/characters
WillSchwieder May 10, 2022
365d88c
Commit to keep me honest
WillSchwieder May 10, 2022
68200c8
Final commit
WillSchwieder May 10, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 6 additions & 0 deletions app/controllers/movies_controller.rb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,9 @@ def new

# GET /movies/1/edit
def edit
respond_to do |format|
format.js
end
end

# POST /movies or /movies.json
Expand All @@ -27,6 +30,7 @@ def create
if @movie.save
format.html { redirect_to @movie, notice: "Movie was successfully created." }
format.json { render :show, status: :created, location: @movie }
format.js
else
format.html { render :new, status: :unprocessable_entity }
format.json { render json: @movie.errors, status: :unprocessable_entity }
Expand All @@ -40,6 +44,7 @@ def update
if @movie.update(movie_params)
format.html { redirect_to @movie, notice: "Movie was successfully updated." }
format.json { render :show, status: :ok, location: @movie }
format.js
else
format.html { render :edit, status: :unprocessable_entity }
format.json { render json: @movie.errors, status: :unprocessable_entity }
Expand All @@ -53,6 +58,7 @@ def destroy
respond_to do |format|
format.html { redirect_to movies_url, notice: "Movie was successfully destroyed." }
format.json { head :no_content }
format.js
end
end

Expand Down
2 changes: 2 additions & 0 deletions app/models/movie.rb
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
class Movie < ApplicationRecord
belongs_to :director

has_many :characters, dependent: :destroy
end
13 changes: 13 additions & 0 deletions app/views/layouts/application.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,21 @@
<%= csrf_meta_tags %>
<%= csp_meta_tag %>

<meta charset="utf-8">

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/js/all.min.js"></script>

<%= stylesheet_link_tag 'application', media: 'all' %>
<%= javascript_pack_tag 'application' %>
<script
src="https://code.jquery.com/jquery-3.6.0.js"
integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk="
crossorigin="anonymous"></script>
</head>

<body>
Expand Down
9 changes: 9 additions & 0 deletions app/views/movies/_director_id.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
<div id="<%= dom_id(movie) %>_director_id">
<%= link_to movie_edit_director_id_path(movie), remote: true do %>
<% if movie.director.present? %>
<%= movie.director.name %>
<% else %>
Add director
<% end %>
<% end %>
</div>
1 change: 1 addition & 0 deletions app/views/movies/_edit_director_id.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
$("#<%= dom_id(@movie) %>_director_id").replaceWith("<%= j(render "movies/director_id", movie: @movie)%>");
8 changes: 8 additions & 0 deletions app/views/movies/_edit_duration.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
<td id="<%= dom_id(movie)%>_duration">

<%= form_with(model: movie, local: false) do |form| %>

<%= form.label :duration, class: "sr-only" %>
<%= form.text_field :duration, class: "form-control" %>
<% end %>
</td>
8 changes: 8 additions & 0 deletions app/views/movies/_edit_title.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
<td id="<%= dom_id(movie)%>_title">

<%= form_with(model: movie, local: false) do |form| %>

<%= form.label :title, class: "sr-only" %>
<%= form.text_field :title, class: "form-control" %>
<% end %>
</td>
8 changes: 8 additions & 0 deletions app/views/movies/_edit_year.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
<td id="<%= dom_id(movie)%>_year">

<%= form_with(model: movie, local: false) do |form| %>

<%= form.label :year, class: "sr-only" %>
<%= form.text_field :year, class: "form-control" %>
<% end %>
</td>
92 changes: 47 additions & 45 deletions app/views/movies/_form.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,47 +1,49 @@
<%= form_with(model: movie) do |form| %>
<% if movie.errors.any? %>
<div id="error_explanation">
<h2><%= pluralize(movie.errors.count, "error") %> prohibited this movie from being saved:</h2>

<ul>
<% movie.errors.each do |error| %>
<li><%= error.full_message %></li>
<% end %>
</ul>

<%= form_with(model: movie) do |form| %>
<% if movie.errors.any? %>
<div id="error_explanation">
<h2><%= pluralize(movie.errors.count, "error") %> prohibited this movie from being saved:</h2>

<ul>
<% movie.errors.each do |error| %>
<li><%= error.full_message %></li>
<% end %>
</ul>
</div>
<% end %>

<div class="field">
<%= form.label :title %>
<%= form.text_field :title %>
</div>

<div class="field">
<%= form.label :description %>
<%= form.text_area :description %>
</div>

<div class="field">
<%= form.label :duration %>
<%= form.number_field :duration %>
</div>

<div class="field">
<%= form.label :image %>
<%= form.text_field :image %>
</div>

<div class="field">
<%= form.label :year %>
<%= form.number_field :year %>
</div>
<% end %>

<div class="field">
<%= form.label :title %>
<%= form.text_field :title %>
</div>

<div class="field">
<%= form.label :description %>
<%= form.text_area :description %>
</div>

<div class="field">
<%= form.label :duration %>
<%= form.number_field :duration %>
</div>

<div class="field">
<%= form.label :image %>
<%= form.text_field :image %>
</div>

<div class="field">
<%= form.label :year %>
<%= form.number_field :year %>
</div>

<div class="field">
<%= form.label :director_id %>
<%= form.text_field :director_id %>
</div>

<div class="actions">
<%= form.submit %>
</div>
<% end %>
<div class="field">
<%= form.label :director_id %>
<%= form.text_field :director_id %>
</div>

<div class="actions">
<%= form.submit %>
</div>
<% end %>
</td>
21 changes: 21 additions & 0 deletions app/views/movies/_movie.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
<tr id="movie_<%= movie.id %>">
<td id="movie_<%= movie.id %>_title"><%= link_to movie.title, "movies/" + movie.id.to_s + "/edit", remote: true %></td>
<td id="movie_<%= movie.id %>_year"><%= link_to movie.year, "movies/" + movie.id.to_s + "/edit", remote: true %></td>
<td id="movie_<%= movie.id %>_director"><%= link_to movie.director.name, "movies/" + movie.id.to_s + "/edit", remote: true %></td>
<td id="movie_<%= movie.id %>_description">
<details>
<summary>
Show Descriptions
</summary>
<p><%= movie.description %></p>
</details>
</td>
<td id="movie_<%= movie.id %>_duration"><%= link_to movie.duration, "movies/" + movie.id.to_s + "/edit", remote: true %></td>
<td><%= link_to movie,
method: :delete,
remote: true,
class: "btn btn-link btn-sm text-muted" do %>
<i class="fas fa-trash fa-fw"></i>
<% end %>

</tr>
49 changes: 49 additions & 0 deletions app/views/movies/_new_movie.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,49 @@
<td id="movie_<%= dom_id(movie)%>">
<%= form_with(model: movie, local: false) do |form| %>
<% if movie.errors.any? %>
<div id="error_explanation">
<h2><%= pluralize(movie.errors.count, "error") %> prohibited this movie from being saved:</h2>

<ul>
<% movie.errors.each do |error| %>
<li><%= error.full_message %></li>
<% end %>
</ul>
</div>
<% end %>
<tr id = "new_movie_form" >
<td id = "movie_title_field" >
<%= form.label :title, class: "sr-only" %>
<%= form.text_field :title, class: "form-control" %>

</td>

<td id = "movie_year_field" >
<%= form.label :year, class: "sr-only" %>
<%= form.number_field :year, class: "form-control" %>
</td>

<td id = "movie_director_field" >
<%= form.label :director, class: "sr-only" %>
<%= form.select :director_id,
options_from_collection_for_select(Director.order(:name), :id, :name),
class: "form-control" %>

</td>

<td id = "movie_description_field">
<%= form.label :description, class: "sr-only" %>
<%= form.text_area :description, class: "form-control" %>
</td>

<td id = "movie_duration_field">
<%= form.label :duration, class: "sr-only" %>
<%= form.number_field :duration, class: "form-control" %>
</td>

<td class="actions">
<%= form.submit class: "btn btn-outline-secondary btn-block" %>
</td>
</tr>
<% end %>
</td>
1 change: 1 addition & 0 deletions app/views/movies/_show_duration.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
<td id="movie_<%= movie.id %>_duration"><%= link_to movie.duration, "movies/" + movie.id.to_s + "/edit", remote: true %></td>
1 change: 1 addition & 0 deletions app/views/movies/_show_title.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
<td id="movie_<%= movie.id %>_title"><%= link_to movie.title, "movies/" + movie.id.to_s + "/edit", remote: true %></td>
1 change: 1 addition & 0 deletions app/views/movies/_show_year.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
<td id="movie_<%= movie.id %>_year"><%= link_to movie.year, "movies/" + movie.id.to_s + "/edit", remote: true %></td>
17 changes: 17 additions & 0 deletions app/views/movies/create.js.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
console.log("it's working")


var added_movie = $("<%= j(render @movie) %>");

added_movie.hide();

console.log("<%= dom_id(@movie) %>")

$("#new_movie_form").after(added_movie);

added_movie.slideDown();

$("#movie_title_field #movie_title").val("");
$("#movie_year_field #movie_year").val("");
$("#movie_description_field #movie_description").val("");
$("#movie_duration_field #movie_duration").val("");
3 changes: 3 additions & 0 deletions app/views/movies/destroy.js.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
$("#movie_<%= @movie.id %>").fadeOut(function() {
$(this).remove();
});
6 changes: 6 additions & 0 deletions app/views/movies/edit.js.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@

$("#movie_<%=@movie.id%>_title").replaceWith("<%= j(render('edit_title', movie: @movie)) %>");

$("#movie_<%=@movie.id%>_year").replaceWith("<%= j(render('edit_year', movie: @movie)) %>");

$("#movie_<%=@movie.id%>_duration").replaceWith("<%= j(render('edit_duration', movie: @movie)) %>");
18 changes: 5 additions & 13 deletions app/views/movies/index.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,28 +4,20 @@

<table>
<thead>
<tr>
<tr id = "table_begin" >
<th>Title</th>
<th>Description</th>
<th>Duration</th>
<th>Year</th>
<th>Director</th>
<th>Description</th>
<th>Duration</th>
<th colspan="3"></th>
</tr>
</thead>

<tbody>
<%= render "movies/new_movie", movie: Movie.new %>
<% @movies.each do |movie| %>
<tr>
<td><%= movie.title %></td>
<td><%= movie.description %></td>
<td><%= movie.duration %></td>
<td><%= movie.year %></td>
<td><%= movie.director_id %></td>
<td><%= link_to 'Show', movie %></td>
<td><%= link_to 'Edit', edit_movie_path(movie) %></td>
<td><%= link_to 'Destroy', movie, method: :delete, data: { confirm: 'Are you sure?' } %></td>
</tr>
<%= render "movies/movie", movie: movie %>
<% end %>
</tbody>
</table>
Expand Down
3 changes: 3 additions & 0 deletions app/views/movies/update.js.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
$("#<%= dom_id(@movie) %>_title").replaceWith("<%= j(render("show_title", movie: @movie)) %>");
$("#<%= dom_id(@movie) %>_year").replaceWith("<%= j(render("show_year", movie: @movie)) %>");
$("#<%= dom_id(@movie) %>_duration").replaceWith("<%= j(render("show_duration", movie: @movie)) %>");
7 changes: 7 additions & 0 deletions config/routes.rb
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,15 @@
Rails.application.routes.draw do
root "movies#index"




resources :characters
resources :actors
resources :directors
resources :movies

get("/edit_year", { :controller => "movies", :action => "edit_year" })


end