首页 > 解决方案 > Laravel 5.5 本地化和 CKEditor

问题描述

我想用ckeditor替换多个textarea(Content En和Content Ru),但它们都有相同的ID。怎么办,因为加载一个编辑器后,它就停止了。

形式:

{!! Form::open([ 'route' => 'portfolio.store', 'files' => 'true']) !!}

        @foreach(config('translatable.locales') as $locale)
            <div class="form-group">
                <label for="translation[{{$locale}}][title]"><strong>Title ({{$locale}})</strong></label>
                <input type="text" id="title"
                       name="translation[{{$locale}}][title]"
                       class="form-control"
                       value="{{ old('translation.'. $locale.'.title')  }}">
            </div>

            <div class="form-group">
                <label for="translation[{{$locale}}][content]"><strong>Content ({{$locale}})</strong></label>
                <textarea name="translation[{{$locale}}][content]"
                          id="content"
                          class="form-control"
                          cols="30"
                          rows="10">{{ old('translation.'. $locale.'.content') }}</textarea>
            </div>
        @endforeach

            <div class="form-group">
                <label for="image"><strong>Image</strong></label>
                <input type="file" id="image" name="image" class="form-control-file">
            </div>
            <br>

            <input class="btn btn-success btn-lg btn-block" type="submit" value="Add Portfolio">
    {!! Form::close() !!}

脚本:

<script>
    CKEDITOR.replace( 'content' );
</script>

在此处输入图像描述

标签: laravelckeditor

解决方案


我可以从 CKEditor 的角度解释它是如何工作的。

请参阅:https ://ckeditor.com/docs/ckeditor4/latest/api/CKEDITOR.html#cfg-replaceClass和http://nightly.ckeditor.com/18-09-06-06-04/full/samples /old/replacebyclass.html

CKEditor 可以替换多个文本区域,前提是它们分配了一个特定的 CSS 类(ckeditor默认情况下)。您需要做的就是在 HTML 文档的标题部分附加 CKEditor 脚本,然后添加一堆<textarea class="ckeditor" name="editor1"></textarea>元素。它们应该自动更改为编辑器。

或者,您可以textarea使用 random 生成元素id's,收集这些元素,id's然后使用迭代步骤replace在循环中运行该方法。id


推荐阅读