I'm a beginner to Rails and I'm following a tutorial to build a Todo App.
When I try to click the button in the browser (in the application.html.haml code below) nothing happens. It is as if it is unresponsive. I see when I hover over the button it is supposed to direct me to localhost:3000/tasks/new
.
Here's a snapshot of how the page looks as of now:
In the tutorial, there is a modal that is used to render the new todo task. The code for the modal is in new.js.erb
in view
> tasks
:
m = $('#modal');
m.html('<%= j(render partial: 'task_form', locals: {task: @task}) %>');
m.modal('show');
The partial task_form.html.haml code is:
.modal-header
%h1 New Task
= simple_form_for task, class: 'clearfix' do |f|
.modal-body
= f.input :title
= f.input :note
= f.input :completed
.modal-footer
= f.submit 'Save', class: 'btn btn-primary'
The code for home.html.haml
is:
.container
- if @tasks.empty?
%span.text-warning There are no tasks!
- else
%table.table.table-hover.table-bordered
%thead
%tr
%th Title
%th Created at
%th Completed
%tbody
- @tasks.each do |task|
%tr
%td
%strong= task.title
%td.text-info= task.created_at
%td.text-success= task.completed
#modal.modal.fade
And for the application.html.haml
is:
!!!
%html
%head
%title Todo
= csrf_meta_tags
= csp_meta_tag
= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload'
= javascript_include_tag 'application', 'data-turbolinks-track': 'reload'
%body
.container
.jumbotron.text-center
%h1
ToDo
%p
Welcome to the tutorial's ToDo application
= link_to 'New task', new_task_path, class: 'btn btn-primary', remote: true
= yield
I tried looking for a solution everywhere but I couldn't find it. I thought I'd post it here for help from any good samaritans..Could you let me know why I cannot see the modal?
Thanks a lot for any help.
I finally got it. I forgot to install the gem 'jquery-rails' and make the necessary additions to the application.js
and application.scss
. Restarting the server after that resulted in a modal. Thanks!
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.