如何通过 ajax 从 Summernote 编辑器将数据发送到 php 文件？

Posted 2023-03-22

【中文标题】如何通过 ajax 从 Summernote 编辑器将数据发送到 php 文件？

【英文标题】：How can I send data from a summernote editor via ajax to a php file?

【发布时间】：2019-11-13 23:41:35

【问题描述】：

我正在尝试从 Summernote 编辑器捕获数据并通过 ajax 将其发送到 php 文件。

我正在使用 load() 将一组参数传递给一个运行良好的 php 文件；但我必须明白，summernote 数据是由 HMTL 标签组成的，验证summernote 数据以进行传输需要付出很多努力。相反，我决定使用 $.ajax() 进行另一个 ajax 调用。每次我发送数据时，load() ajax 调用都有效，但 $.ajax() 无效，而是出现错误说明 -

Uncaught TypeError: Illegal invocation
    at i (jquery.min.js:2)
    at jt (jquery.min.js:2)
    at Function.w.param (jquery.min.js:2)
    at Function.ajax (jquery.min.js:2)
    at htmlButtonElement.<anonymous> (<anonymous>:88:58)
    at HTMLButtonElement.dispatch (jquery.min.js:2)
    at HTMLButtonElement.y.handle (jquery.min.js:2)

下面是我的代码

    $(document).ready(function() 
      $("#summernote").summernote();
      //Comment
      var commentForm = document.getElementById("commentForm");
      var domID = "#taskPro" + jobID;

      $(domID).html('<div class="progress-bar progress-bar-striped progress-bar-animated bg-danger" style="width:100%;">Sending Report</div>');
      $(domID).load("../../../config/actions.php?cN=" + customerNumber + "&date=" + date + "&fullName=" + newString7 + "&address=" + newString8 + "&landMark=" + newString9 + "&commet=" + comment + "&complextion=" + complextion + "&type1=" + type1 + "&type2=" + type2 + "&color=" + color + "&xOwner=" + newString0 + "&areaProfile=" + newString1 + "&ifn=" + newString2 + "&ixOwner=" + newString3 + "&iAddress=" + newString4 + "&telephone=" + newString5 + "&requestType=" + newString6 + "&jobID=" + jobID + "&gpsCoords=" + gpsCoords + "&submitReport=1");
      //Post Comment
      $.ajax(
        url: "../testAction.php",
        type: "POST",
        data: new FormData(commentForm),
        contentType: "text/plain"
      );
    );
    <form method="post" action="" id="commentForm">
      <textarea class="form-control" name="comment" id="summernote"><p>Comment: Should contain Comment, Verification Status Description, Building deatails. Also upload images where neccessary</p></textarea>
    </form>

    <script>
    </script>

我希望使用 mysqli_real_escape_string() 将从 Summernote 编辑器捕获的数据提交到数据库

【问题讨论】：

您的代码运行不正常。请尝试解决错误。

@ShivaniPatel 这只是我代码的一小部分......我没有包含 jquery 和 Summernote 库......但我认为你可以在最后部署它并帮助我解决它。谢谢

可以这样获取summernote的值：$('#summernote').code();

我知道... $("#summernote").summernote("code");问题是通过 ajax 将其发送到 php 文件

【参考方案1】：

你可以试试下面的代码：

  $.ajax(
            type: "POST",
            url: "../testAction.php",
            data :  summernote : $("#summernote").summernote("code"); ,
            success: function(response) 
                // response 
                // console.log(response,"response");
            ,
            error: function(errResponse) 
                // alert(errResponse)
                // console.log("errResponse", errResponse);
            
        )

【参考方案2】：

您需要正确解析 FormData 值。

data: new FormData($('#commentForm')[0]),
contentType: false,
processData: false

【讨论】：

#commentForm 是 textarea 的 id 吗？

我试过了……没有报错，也没有得到任何结果