I've spent a week right now trying to get this to work, reading as much as I can about remotipart, and trying to set it right, but I have failed miserably. I have form which has a title, description, an audio file and an image file. If I submit the form without remote: true
it works perfectly, but once I try to upload the form with ajax, it seems like the files are not being uploaded.
Since I made the audio file a requirement for posting, I get redirected to the new action, displaying the error indicating that 'audio' must not be blank.
Even if I remove this validation from the model, once I try to upload, there is no audio file being uploaded.
Also, by checking the developer tools, I've realized that the response I'm getting is not javascript, but html.
I've already tried other gems, like jquery-uploadfile-rails
, but none of them work for me for different reasons. I have no idea what to do right now.
_form.html.erb
<%= form_for(post, html: {multipart: true, remote: true}, authenticity_token: true) do |f| %>
<div id="form-content">
<div class="input-group field">
<span class="input-group-addon"><%= f.label 'Title' %></span>
<%= f.text_field :title, class: "form-control", placeholder: "Title" %>
</div>
<div class="input-group field">
<span class="input-group-addon"><%= f.label :descrption %></span>
<%= f.text_field :description, class: "form-control", placeholder: "Brief Description" %>
</div>
<div class="input-group field">
<span class="input-group-addon"><%= f.label :audio %></span>
<%= f.file_field :audio, class: "filestyle", 'data-iconName' => "glyphicon glyphicon-music", 'data-buttonText' => "Browse" %>
</div>
<div class="input-group field">
<span class="input-group-addon"><%= f.label :art %></span>
<%= f.file_field :art, class: "filestyle", 'data-iconName' => "glyphicon glyphicon-picture", 'data-buttonText' => "Browse" %>
</div>
<%= button_tag(type: 'submit', class: "btn btn-block btn-primary", id: "btn-post") do %>
<span class="icon-ok icon-white"></span> Post now!
<% end %>
</div>
<% end %>
posts_controller.rb
def create
@post = Post.new(post_params)
@post.user_id = current_user.id
respond_to do |format|
if @post.save
format.html { redirect_to action: 'index' }
format.js
format.json { render :show, status: :created, location: @post }
else
format.html { render :new }
format.js
format.json { render json: @post.errors, status: :unprocessable_entity }
end
end
end
create.js.erb
// Display a Javascript alert
alert('success!');
<% if remotipart_submitted? %>
alert('submitted via remotipart')
<% else %>
alert('submitted via native jquery-ujs')
<% end %>
Lastly, I'm still learning about rails, it's arquitechture, and the 'rails way'. Even though I've been trying to do everything correctly, I'm pretty sure I have been improvising some parts, trying to solve errors. If you find anything weird and feel like sharing, I'll be completely open to learn the good way. If you need to check any other part of my code just tell me. Thanks!