I'm fairly new to using ajax so I'm really hoping there is any easy fix to this. Currently what happens is I click 'New Schedule Entry' and a form gets appended to the table (see _form.html.erb). The issue is that the form does not work. Submit doesn't work, the date_picker/time_picker doesn't show up, the HTML5 validation doesn't pop up. I feel like there is a simple solution to this that I am missing.
Relevant gems
- gem 'turbolinks'
- gem 'jquery-turbolinks' <--added because I was hoping this would fix the issue
- gem 'jquery-rails'
new.js.erb
$('#schedule-table-tbody').prepend("<%= j(render partial: 'form') %>");
relevant part of index.html.erb
<%= link_to 'New Schedule Entry', new_schedule_path, remote: true %>
<div class="table-responsive">
<table id="schedule-table" class="table table-hover table-striped table-condensed">
<thead>
<tr>
<th class="col-xs-2">Date</th>
<th class="col-xs-2">Start Time</th>
<th class="col-xs-2">End Time</th>
<th class="col-xs-6">Details</th>
</tr>
</thead>
<tbody id="schedule-table-tbody">
schedules_controller.rb
class SchedulesController < ApplicationController
respond_to :html, :js
def index
@schedules = Schedule.page(params[:page]).per(20)
end
def show
@schedule = Schedule.find(params[:id])
end
def new
@schedule = Schedule.new
end
def create
@schedule = Schedule.new(schedule_params)
if (@schedule.save)
flash['main|success'] = 'Successfully created schedule entry.'
redirect_to schedules_path
else
render 'index'
end
end
private
def schedule_params
params.require(:schedule).permit(:name, :date, :start_time, :end_time)
end
end
_form.html.erb
<tr>
<%= simple_form_for @schedule do |f| %>
<td>
<%= f.input_field :date, :as => :date_picker, label: false %>
</td>
<td>
<%= f.input_field :start_time, :as => :time_picker, label: false %>
</td>
<td>
<%= f.input_field :end_time, :as => :time_picker, label: false %>
</td>
<td>
<%= f.input_field :name, label: false %>
</td>
<td>
<%= f.button :button, class: "btn btn-primary" do %>
<span class='glyphicon glyphicon-ok'></span> Save
<% end %>
</td>
<% end %>
</tr>
Aucun commentaire:
Enregistrer un commentaire