如何将数据库填充的summernote字段显示到页面

Posted 2023-03-22

【中文标题】如何将数据库填充的summernote字段显示到页面

【英文标题】：How to display database populated summernote field to a page

【发布时间】：2019-12-08 21:37:21

【问题描述】：

我有一个页面显示一些在线培训课程。每门课程都有一个标题和描述。我想通过summernote获取描述，这是我第一次使用这个插件。 我设置它。我得到用户数据。并保存它。 但现在我不知道如何将保存的summernote 字段从数据库显示到我的页面。

    @foreach ($courses as $course)
      <div class="col-md-6" id="coursebox_$course->id">
        <img class="rounded img-responsive courseImage" id="courseImage$course->id" src="images/$course->course_image"  name="" style="width: 350px ; height :250px"> 
        <div class="blurb blurb-border mb-md-4"> 
          <i class=" pr-4 text-primary"></i>
          <div >
            <h6 class="mb-2  coursetitle" id="coursetitle$course->id">$course->course_title</h6>
            <div class="divincludep" contenteditable="true">
                <p class="coursedesc pinsidediv" id="coursedesc$course->id">$course->course_desc</p>
            </div>
            <a href="#" class="btn-read-more categorys" id="coursecat$course->id" data-id="$course->categories->id">$course->categories->category_title</a>
            <br>
            <h6 class="card-title" Style="margin-top: 1rem">Author : 
              <span style="font-size:1rem; font-weight:normal">$course->authors->name</span>
            </h6>
            <a href="#">
              <button type="button" class="btn btn-warning editmodalopen" data-coursebox="coursebox_$course->id" data-courseid="$course->id">Edit</button>
            </a>&nbsp;
            <button type="button" id="deleteCourseBox$course->id" class="btn btn-danger deleteCourseBox" data-coursebox="deletecoursebox_$course->id" data-courseid="$course->id">Delete</button>
          </div>
        </div>
      </div>
    @endforeach

这是我要显示课程描述的地方：

但结果是我保存的确切内容。但我想显示格式化的文本，就像我从用户那里得到的一样。

【参考方案1】：

试试

!! $course->course_desc !!

【讨论】：

但是还有一个问题。当我想再次编辑富文本时，我在使用summernote并编辑记录的模式中有未格式化的文本（简单文本）。我使用此代码设置编辑模式：'code' $('.editmodalopen').click(function() var coursebox = $(this).data('coursebox'); var title = $('#' + coursebox + ' .coursetitle').text(); var desc = $('#'+ coursebox + ' .coursedesc').text(); 'code' 我该如何解决这个问题？@zahidhasanemon

您可以使用一个隐藏的项目来保存富文本并以模式从该项目加载富文本。

很高兴它有帮助:)