将数据传递到使用TINYMCE WYSIWYG的bootstrap模式中的textarea

时间:2017-08-28 03:48:29

标签: laravel tinymce laravel-5.3 bootstrap-modal tinymce-4

我正在创建一个博客,我想更新评论, 我想将注释的当前数据传递给使用TINYMCE WYSIWYG编辑器的textarea。

问题是如果我对textarea使用tinymce,那么当前数据将不会显示在textarea上。

这是我如何做的

这是触发模态的按钮:

<button type="button" class="btn btn-success btn-xs" data-toggle="modal" data-target="#myModal" data-id="{{ $comment->id }}" data-comment=" {{ $comment->comment }}"><i class="fa fa-pencil"></i></button>

这是模态

    <!--UPDATE COMMENT Modal -->
  <div class="modal fade modal-md" id="myModal" role="dialog">
    <div class="modal-dialog">

      <!-- Modal content-->
      <div class="modal-content modal-success">
      {{ Form::open(['route' => ['comments.update'], 'method' => 'PUT']) }}
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h5 class="modal-title"><b>Update Comment </b></h5>
        </div>
        <div class="modal-body">
            <div id="comment-form" class="">

                <div class="row">
                    <div class="col-md-12">
                        {!! Form::hidden('id', '', ['id' => 'comment-id']) !!}

                        {{ Form::textarea('comment', '', ['id'=>'comment-comment','class' => 'form-control', 'rows' => '3']) }}

                    </div>
                </div>

            </div>
        </div>
        <div class="modal-footer">
            <button type="submit" class="btn btn-success"><b>Update</b></button>
            <button type="button" class="btn btn-default" data-dismiss="modal"> <b>Cancel</b></button>
        </div>
        {{ Form::close() }}
      </div>
    </div>
  </div>

这是我的js:

    <script type="text/javascript" charset="utf-8">

tinymce.init({
    selector: 'textarea',
    menubar: false,
    toolbar: false,
    statusbar:  false,
     height:     10
  });

<!--UPDATE COMMENT MODAL-->
$(function() {
    $('#myModal').on("show.bs.modal", function (e) {
         $("#comment-comment").val($(e.relatedTarget).data('comment'));
         $("#comment-id").val($(e.relatedTarget).data('id'));
    });
});

// Prevent bootstrap dialog from blocking focusin
$(document).on('focusin', function(e) {
    if ($(e.target).closest(".mce-window").length) {
        e.stopImmediatePropagation();
    }
});

$('#open').click(function() {
    $("#dialog").dialog({
        width: 800,
        modal: true
    });
});

</script>

1 个答案:

答案 0 :(得分:0)

   {!! Form::hidden('id', $data->id , ['id' => 'comment-id']) !!}

   {{ Form::textarea('comment', $data->coment, ['id'=>'comment-comment','class' => 'form-control', 'rows' => '3']) }}

如果您使用表单打开该案例,则需要指定一个类似“$ data-&gt; coment”的值。如果您使用Form模型,则不需要指定任何值,只需要添加null。请查看以下链接。

https://laravel.com/docs/4.2/html#form-model-binding