Я использую Summernote, и он работает для всего текста, но у меня возникают проблемы с установкой вызова AJAX для загрузки изображения. Я получаю предупреждение "$ summernote не определено ReferenceError: $ summernote не определено в HTMLTextAreaElement.onImageUpload". Это не фактическая ошибка, просто предупреждение, но функция не вызывается.
<script type="text/javascript">
$(document).ready(function() {
$('#summernote').summernote({
lang: 'en-EN',
placeholder: 'Article content...',
tabsize: 2,
height: 200,
shortCuts: false,
disableDragAndDrop: true,
toolbar: [
['style', ['bold', 'italic', 'underline', 'clear']],
['fontsize', ['fontsize']],
['color', ['color']],
['para', ['ul', 'ol', 'paragraph']],
['table', ['table']],
['insert', ['link', 'picture']],
['view', ['codeview', 'help']]
],
callbacks: {
onImageUpload: function(files) {
// upload image to server and create imgNode...
$summernote.summernote('insertNode', imgNode);
}
}
});
});
$('#summernote').on('summernote.image.upload', function(we, files) {
// upload image to server and create imgNode...
$summernote.summernote('insertNode', imgNode);
});
</script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js" integrity="sha256-0YPKAwZP7Mp3ALMRVB2i8GXeEndvCq3eSl/WsAl1Ryk=" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/summernote@0.8.16/dist/summernote.min.css" rel="stylesheet"> <script src="https://cdn.jsdelivr.net/npm/summernote@0.8.16/dist/summernote.min.js"></script>
</head>
<body>
<form ...>
<div class="row">
<div class="col-md-12">
<textarea id="summernote" name="editordata"><?php echo $this->input->post('editordata'); ?></textarea>
</div>
</div>
</form>