Rails 5 does not render when called from javascript/ajax

Hi Everyone,

I am having a problem getting Rails to render a page when it is

called from javascript/ajax. I posted a detailed question on StackOverflow but no one has answered yet.` (Rails 5 will not render POST made from javascript)``

`    Basically,  I am doing a very simple ajax POST (also tried GET

with same results), the equivalent of: localhost:3000/lockout/2016-03-16.

The ajax request gets past routes.rb, and calls the appropriate

method in the controller. The controller processes it correctly (database is updated, debug print statements show up in log, etc.) but it does NOT render.

When I submit the same request manually from the browser (as a GET)

it again is processed correctly, but then it DOES render.

In all cases the log shows this (with times slightly different):

*      Started POST "/lockout/2016-03-16" for 127.0.0.1 at 2016-03-06

13:05:22 -0500* Processing by LockoutsController#toggle as HTML *

Can you show us the code you are you using to do the post?

Colin

Hi Colin,

Sure!

This is the whole thing (including alerts to let me know when clicks are handled):

     <script>        var AUTH_TOKEN = $('meta[name=csrf-token]').attr('content');        $(document).ready(function()        {          $('#calendar').fullCalendar(          {            minTime: "08:00:00",            maxTime: "20:00:00",            eventRender: function (event, element) {              element.click(function() {});            },            eventClick: function(calEvent, jsEvent, view) {              alert('Clicked on: ' + calEvent.format());            },            dayClick: function(date, jsEvent, view) {              alert('You Clicked on: ' + date.format());              // $.post('/lockout/'+date.format())              $.ajax({                url: '/lockout/'+date.format(),                type: 'post',                dataType: "html",                data: "&authenticity_token="+AUTH_TOKEN,                success: function(){alert('SUCCESS');},                error: function()                {                  alert('error posting date');                }              });            },            events:            {              url: '/populate_events',              type: 'GET',              error: function()              {                alert('there was an error while fetching events!');              }            },            fixedWeekCount: false,            header:            {              left: 'month,agendaWeek',              center: 'title',              right: 'today prev,next'            }          });          $('#calendar').fullCalendar('option', 'aspectRatio', 2.2);        });      </script>

It's not very complicated. The alert "You clicked on..." always occurs when it is supposed to, and the alert('SUCCESS') occurs immediately thereafter.

The alert('error posting date') only occured when I messed up the routing, earlier in my development,

Thanks,

Don

You are not doing anything with the response that comes back on success. That should contain the data you are rendering in the server.

Colin

It always pays to have experts look at your code!

Changing:

success: function(){alert('SUCCESS');}

to:

success: function(){window.location.reload(true);}

made the difference. It works now.

Thank you Colin,

Don

I'm rather curious, if what you want is a full page reload at that point, why you're bothering using AJAX?

Because I don’t know any other way to go from the fullcalendar javascript event to the server. . If you have a better approach, please tell me how. It is never too late to learn something new (I’m 73 years old and started programming in the late 1950’s. I’ve been learning a lot of new things since then ). I would really like to process the dayclick event on the server, prompt the user for a response, then reload the page. That implies that I need to render html or json to do the prompting, then reload the page with data conditioned on the user’s response. So far I haven’t been able to do that. Thanks Don