I just strat using the latest version of summernote. Version 7.
For some reason this image upload code is not working. The line onImageUpload: function(files) {sendFile(files[0]);}
is not even being executed.
The image successfully appears in the editor but in base64 and it is not uploaded in the uplaods/
folder
All includes have been successfully called.
Js inserted in the head tag of the page
<script>
$(document).ready(function() {
$('#summernote').summernote({
height: 200,
onImageUpload: function(files) {
sendFile(files[0]);
}
});
function sendFile(file) {
var data = new FormData();
data.append("file", file);//You can append as many data as you want. Check mozilla docs for this
$.ajax({
data: data,
type: "POST",
url: 'uploader.php',
cache: false,
contentType: false,
processData: false,
success: function(url) {
$("#summernote").summernote("insertImage", url);
}
});
}
});
</script>
uploader.php
$dir_name = "uploads/";
move_uploaded_file($_FILES['file']['tmp_name'],$dir_name.$_FILES['file']['name']);
echo $dir_name.$_FILES['file']['name'];
Summernote is really easy to use. I jus need to get the image upload working to have the 1000%nof it.
Please, can anyone help me about this?
The position of callbacks in options is changed after v0.7.0
$('#summernote').summernote({
height: 200,
callbacks: {
onImageUpload : function(files, editor, welEditable) {
for(var i = files.length - 1; i >= 0; i--) {
sendFile(files[i], this);
}
}
}
});
and sendFile function
function sendFile(file, el) {
var form_data = new FormData();
form_data.append('file', file);
$.ajax({
data: form_data,
type: "POST",
url: 'uploader.php',
cache: false,
contentType: false,
processData: false,
success: function(url) {
$(el).summernote('editor.insertImage', url);
}
});
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With