SetInterval表单使用AJAX Rails提交

时间:2014-04-06 19:08:43

标签: javascript ajax ruby-on-rails-4

我希望.edit_canvas每隔5秒通过AJAX提交一次。现在似乎没有任何事情发生。我虽然没有控制台错误。

使用Javascript:

setInterval(function(){
  // Get html content of canvas element
  var canvasContent = $('.canvas').html();
  // Populate hidden field with canvas content
  $('#canvas-content').val(canvasContent);

  // Submit form with AJAX
  $('.edit_canvas').submit(function() {
      var valuesToSubmit = $(this).serialize();

      $.ajax({
          url: $(this).attr('action'), //sumbits it to the given url of the form
          type: 'POST',
          data: valuesToSubmit,
          dataType: "JSON" // you want a difference between normal and ajax-calls, and json is standard
      }).success(function(json){
          $('.canvas').css('background', 'pink');
      });

      // Prevent normal behaviour
      return false;
  });
}, 5000);

形式:

<%= form_for @canvas do |f| %>      
    <%= f.hidden_field :content, value: "", id: "canvas-content" %>
    <%= f.submit "Save", id: "save-canvas" %>
<% end %>

1 个答案:

答案 0 :(得分:2)

您正在做的是附加提交事件处理程序,而不是通过ajax提交表单 只需删除提交代码,它就可以正常工作

setInterval(function(){
  // Get html content of canvas element
  var canvasContent = $('.canvas').html();
  // Populate hidden field with canvas content
  $('#canvas-content').val(canvasContent);

  // Submit form with AJAX
      var valuesToSubmit = $('.edit_canvas').serialize();

      $.ajax({
          url: $('.edit_canvas').attr('action'), //sumbits it to the given url of the form
          type: 'POST',
          data: valuesToSubmit,
          dataType: "JSON" // you want a difference between normal and ajax-calls, and json is standard
      }).success(function(json){
          $('.canvas').css('background', 'pink');
      });

}, 5000);