Question

提交表格后，我试图获取AJAX更新html的内容。我的表单提交正确，数据已保存到数据库，如果我手动刷新页面，它将显示在页面上。我正在使用Laravel 5.7和PHP 7.3。

我想要的是在提交便笺时将其保存到数据库，并且在保存便笺后，显示我的便笺的html部分应使用刚刚保存的内容进行更新。

我会让您知道我对AJAX还是陌生的，尽管我认为它并不复杂，但显然我需要学习更多。

JQ：

Add-Migration **CustomerDbContext** -Context CustomerDbContext

部分视图：

$(function() {
    $.ajaxSetup({
      headers: {
      'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
      }
    });

    $("#addPatientNote").submit(function(e){                 
        e.preventDefault();
        var patient_id = $('input[name=patient_id]').val();
        var note = $('textarea#note').val();
        $('#addPatientNoteModal').modal('hide');

        $.ajax({
            method: "POST",
            url: "/patientnotes",
            data: {patient_id: patient_id, note: note, time: time},
            success: function(data){
              console.log('Post Success '+ data.id);
              refreshNote();
            },
            error: function(data, textStatus, errorThrown) {
                console.log("AJAX errorjqXHR: " + textStatus + ' : ' +
            errorThrown + ' : ' + data);

             }
        });
      });
    });

现在在主页上，我也有这个...我添加了refreshNote（）来看看是否有帮助，这不大声笑我很确定我做错了所有这些事情... JQ：

<div class="d-flex w-100 justify-content-between">
        <h5></h5>
        <small>Date: <span id="posted"></span></small>
    </div>
    <p class="lead" id="patient_note"></p>
    <small>By <span id="firstname"></span> <span id="lastname"></span> 
    </small>

Answer 1

无需再次提出ajax请求。只需将data作为refreshNote()函数的参数

function refreshNote(data){           
      var posted = moment(data.created_at).format("MM/DD/YYYY, h:mm:ss a");
      var updated = moment(data.updated_at).format("MM/DD/YYYY, h:mm:ss a");
      $('#patient_note').html(data.note);
      $('#firstname').html(data.first_name);
      $('#lastname').html(data.last_name);
      $('#posted').html(posted);
      $('#updated_by').html(data.updated_by);
      $('#updated_at').html(updated);
      console.log('Success '+ data.note);
}

// then use it in success function
refreshNote(data);

注意：：第1个：id应该是唯一的..第2个：此代码不会在ajax成功定义数据的地方之外运行，因为您会收到{ {1}}

Laravel 5.7-AJAX发布到DB不会刷新主页中的结果

1 个答案: