I am trying to obtain the code from one summernote(which has loaded fine) but I am facing the error mentioned in the title. You have a code snippet here:
In the body I have declare one of my summernotes like this:
<div class="summernote1" name="intro_summer_note" id="intro_summer_note"></div>
Then under the script tags I am trying the following:
$('.summernote1').summernote({
placeholder: 'Write your intro',
tabsize: 2,
height: 250,
toolbar: [
['style', ['style']],
['font', ['bold', 'underline', 'clear']],
['color', ['color']],
['para', ['ul', 'ol', 'paragraph']],
['table', ['table']],
['insert', ['link', 'picture', 'video']],
['view', ['fullscreen', 'codeview', 'help']]
]
});
function submitSummerNote()
{
console.log('Entered here')
var markupStr = $('.summernote1').summernote('code');
console.log(markupStr);
}
I have tried the examples from the summernote page and I am getting into the exactly same issue. I have also tried updating the jQuery version. Right now I am trying the following versions for jQuery and Bootstrap:
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <link href="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote-lite.min.css" rel="stylesheet"> <script src="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote-lite.min.js"></script>
I think that you are messing with positioning, i've launched the code and it ran without any problem, be sure to put both Bootstrap and jQuery before your script, like:
<link href="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote-lite.min.css" rel="stylesheet">
<div class="summernote1" name="intro_summer_note" id="intro_summer_note"></div>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote-lite.min.js">
</script>
<script>
$('.summernote1').summernote({
placeholder: 'Write your intro',
tabsize: 2,
height: 250,
toolbar: [
['style', ['style']],
['font', ['bold', 'underline', 'clear']],
['color', ['color']],
['para', ['ul', 'ol', 'paragraph']],
['table', ['table']],
['insert', ['link', 'picture', 'video']],
['view', ['fullscreen', 'codeview', 'help']]
]
});
function submitSummerNote()
{
console.log('Entered here')
var markupStr = $('.summernote1').summernote('code');
console.log(markupStr);
}
</script>