Question

在我的rails应用程序上，我生成了一个自定义表单来自己创建一个Lesson对象，因为form_for没有给我我需要的细节。作为一个常规的HTML表单，它提交没有麻烦。当应用程序在日历中预订课程时，表格会在一周内每小时重复一次，每个小时都有一个自定义ID。

然后我继续尝试向视图中添加一些AJAX，以便表单提交时不会重新加载整个页面。从表面上看，当Success函数运行并且Lesson已成功创建时，它似乎正常工作。在我的Chrome控制台上虽然我多次重复出现以下错误，但在我的rails服务器日志中出现类似的错误：

POST http://localhost:3000/lessons 422 (Unprocessable Entity) 
 send 
 oe.extend.ajax
 (anonymous function) 
 oe.event.dispatch
 g.handle

如果我尝试在不同的时间段创建课程，那么AJAX不会触发，并且会在页面重新加载时正常创建课程。

其他答案表明这是一个身份验证问题（特别是因为它是我自己创建的一个自定义表单而不是form_for）但不像他们的情况我的第一次似乎仍然成功提交，尽管AJAX不能在第二次运行尝试。我真的不确定这里发生了什么，所以任何指导都会受到赞赏

#An except showing the custom form and JS to submit a new lesson
<form role="form" accept-charset="UTF-8" action="/lessons" class="new_lesson form-inline" id='newlesson-<%= @formatteddate.to_s%>' method="post">
        <button class="btn btn-default" name="commit" type="submit">
          <i class="fa fa-book no-slot"></i>
        </button> 
        <input class="form-control" name="utf8" type="hidden" value="✓">             
        <input class="form-control" id="lesson_starts_at_1i" name="lesson[starts_at(1i)]" type="hidden" value="<%=date.year%>"/>
        <input class="form-control"id="lesson_starts_at_2i" name="lesson[starts_at(2i)]" type="hidden" value="<%=date.month%>"/>
        <input class="form-control"id="lesson_starts_at_3i" name="lesson[starts_at(3i)]" type="hidden" value="<%=date.day%>"/>
        <input class="form-control"id="lesson_starts_at_4i" name="lesson[starts_at(4i)]" type="hidden" value="<%=@time.hour%>"/>
        <input class="form-control"id="lesson_starts_at_5i" name="lesson[starts_at(5i)]" type="hidden" value="00"/>
        <input class="form-control"id="lesson_teacher_id" name="lesson[teacher_id]" type="hidden" value="<%=current_user.id%>"/>
        <input class="form-control"id="lesson_confirmed_id" name="lesson[confirmed]" type="hidden" value="true"/>
      </form>

      <script type="text/javascript">
        $('#newlesson-<%= @formatteddate.to_s%>').submit(function() {  
          var valuesToSubmit = $(this).serialize();
          var button = $(this).find('button');
          $.ajax({
            type: "POST",
            url: $(this).attr('action'), 
            data: valuesToSubmit,
            dataType: "JSON",
            success: function(){
              button.html('<i class="fa fa-book free-slot"></i>');
            }
          });
          return false;
        });
      </script>

Answer 1

我遇到了同样的问题，但我在标题部分的应用程序层中使用此标记解决了这个问题：

%html   
  %head
    ...
    = csrf_meta_tags

其HAML

HTML 422错误，但AJAX表单仍然正确提交

1 个答案: