1

I have a list controller. The create action for the controller is called in many places. I would like to work this method for both ajax and html. Currently I am not able to make it work for ajax call. Although I have remote: true in the form tag, it is sending normal html request. Here is the code for html and action:

list_controller#create..................................

    def create
    @list = current_user.list.new(list_params)
    current_user.list << @list
    respond_to do |format|
      if @list[:name].strip.blank?
        format.html { redirect_to articles_url, notice: "List name can't be blank." }
        format.js { }
      elsif @list.save
        format.html { redirect_to articles_url, notice: 'List was successfully created.' }
        format.js { }
      end
    end
  end

html form............................................

<%= form_for List.new, url: create_list_path,remote: true, authenticity_token: true, html: { class: 'form-horizontal', style: 'display:block;width: 240px;' } do |f| %>
  <div class="form-group donotchange">
    <%= f.text_field :name, class: 'col-xs-8 form-control', placeholder: 'List name', required: true, autocomplete: :off %>
  </div>
  <div class="form-group donotchange text-center">
    <%= f.submit 'Create list', class: "btn btn-success col-xs-12" %>
  </div>

routes.rb.................
post 'create_list' => 'lists#create'

Here is my server Log:

    Started POST "/create_list" for 127.0.0.1 at 2017-08-14 19:21:06 +0545
Processing by ListsController#create as HTML
  Parameters: {"utf8"=>"✓", "authenticity_token"=>"R8g8N+b/g3Fcn8SOOHWGAYtfEKoRUS8Em8NgjcjtsDppaZMnWxT4DpzFHurgyWi0PJgvELLfGTc2I5g5ttMYOg==", "list"=>{"name"=>"my list"}, "commit"=
>"Create list"}
  User Load (1.0ms)  SELECT  `users`.* FROM `users` WHERE `users`.`id` = 1 ORDER BY `users`.`id` ASC LIMIT 1
   (1.0ms)  BEGIN

Here is request headers: (why is it still text/html?)

    Accept  
text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Encoding 
gzip, deflate
Accept-Language 
en-US,en;q=0.5
Connection  
keep-alive
Content-Length  
175

I have the form in a popover. here is the code for that:

 This is placeholder for form(this is inside a modal)...........
<label for="add_to_existing_list">Add to Existing List</label>
                    <a class="pull-right" rel="popover" data-content='' data-placement="right">Create new list</a>

This is the form...........
<div id="popover-content" style="display: none">
  <%= form_for List.new, url: create_list_path,remote: true, authenticity_token: true, html: { class:
                                                                                                   'form-horizontal', style: 'display:block;
  width: 240px;
' } do |f| %>
      <div class="form-group donotchange">
        <%= f.text_field :name, class: 'col-xs-8 form-control', placeholder: 'List name', required: true, autocomplete: :off %>
      </div>
      <div class="form-group donotchange text-center">
        <%= f.submit 'Create list', class: "btn btn-success col-xs-12" %>
      </div>
  <% end %>
</div>

This is the js that loads the popover...........
$('a[rel=popover]').popover({
    html: 'true',
    placement: 'right',
    content : function() {
        return $('#popover-content').html();
    }
})
Amit Pokhrel
  • 282
  • 4
  • 21
  • Can you post the server logs? – Pavan Aug 14 '17 at 12:18
  • I have added the logs, please check – Amit Pokhrel Aug 14 '17 at 13:39
  • @Pavan did you get anything?? – Amit Pokhrel Aug 14 '17 at 17:21
  • Nope. It is strange as it looks. – Pavan Aug 14 '17 at 17:23
  • Have a look at this answer: https://stackoverflow.com/questions/45074980/rspec-and-rails-4-update-skip-callback/45077040#45077040 and try to debug your code and see where the problem is. – Mugur 'Bud' Chirica Aug 15 '17 at 14:09
  • I think the problem is not with rails. Actually the form is insede bootstrap popover. when I place the form outside popover in the same page, the form submits as ajax, but when I put the form inside popover it submits as html.. do you have any idea why? @mugur bud chirica – Amit Pokhrel Aug 18 '17 at 08:47
  • It appears that you have some JavaScript code related to that form (or any form) submission. A form no matter where it is, won't submit AJAX by default. Can you have a look and let me know? – Mugur 'Bud' Chirica Aug 18 '17 at 08:56
  • I have add the code that renders the form inside popover and the js that loads the form. There is also other js for the page but not related to the form. does this help? do you need more information? – Amit Pokhrel Aug 18 '17 at 09:12

0 Answers0