使用 Ajax 在 Laravel 中提交表单答案

【问题标题】：Submitting a form in Laravel using Ajax使用 Ajax 在 Laravel 中提交表单
【发布时间】：2020-06-30 19:31:20
【问题描述】：

Ajax 适用于预先存在的表单。但是如果我使用它添加一个新表单并提交它，那么我会进入方法页面。

添加了一个新的表单，填写了字段并点击了提交：http://joxi.ru/DmBOW4KUzep962

我进入方法页面，而不是在控制台中显示结果：http://joxi.ru/EA4P710TOekbOA

重新加载页面后，一切正常。

这是怎么回事，请告诉我。

正面：

$('.add-answer-form').on('submit', function (e) {
        e.preventDefault();
          $.ajax({
            type: "POST",
            url: `/admin/courses/48/lessons/96/answerAdd`,
            data: $(this).serialize(),
            success: function (data) {
              console.log('!!!!!', data);
            }
          });
      });

   public function answerAdd(Request $request, Course $course, Lesson $lesson, Test $test, Answer $answer){
        $this->answer->fill($request->all())->save();
        return response ()->json ($this);
   }

【问题讨论】：

好吧，在我看来，您在成功回调中的响应似乎没有做任何事情。您需要根据响应注入/构建 html。是这个意思吗？
@KurtFriars，答案至少应该到达控制台，如下所示：joxi.ru/ZrJl84xcME80Z2
我不确定我是否理解您的问题。你是说控制器返回的json中没有添加答案，而是在页面重新加载时答案就在那里？
@KurtFriars，不是真的。答案是 json 格式，但是 URL 更改为被调用的方法，正如我在屏幕截图中显示的那样，而不是仅仅将控制器的结果返回到控制台。
好的，所以您的问题是当添加的答案按钮的 ajax 响应成功时您被重定向？如果是，那么您能否在网络检查器中捕获服务器响应并共享它？

标签： ajax laravel

【解决方案1】：

我解决了这个问题如下：而不是这个：

$ ('.add-answer-form').on('submit', function (e) {

添加了这个：

$ ('#quest-add-form').on('submit', '.add-answer-form', function (e) {

这适用于需要使用 Ajax 添加的表单的情况。

【讨论】：

Artem 干得好！