javascriptlaraveltrumbowyg

Trumbowyg is not a function | Javascript Error


I am working with the laravel framework and trumbowyg (javascript rich text editor, see: https://alex-d.github.io/Trumbowyg/). I am building a page where the user can edit his post and save it immediatly after he change something.

To achieve my goal that the user must not reload the page I am using AJAX to save the changes, but I am getting the error "trumbowyg is not a function" each time I click on my save button.

This is my javascript code:

$(document).ready(function(){
    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': "{{ csrf_token() }}"
        }
    });

    $(document).on('click', '#save', function(){
        $.ajax({
            method: 'POST',
            url: '/user/documents/{{$document->id}}/edit',
            data: {
                'created_post': $('#editor').trumbowyg('html'),
            },
            success: function(response){ 
                console.log(response);
            },
            error: function(jqXHR, textStatus, errorThrown){ 
                console.log(JSON.stringify(jqXHR));
                console.log("AJAX error: " + textStatus + + ' : ' + errorThrown);
            }
        });
    })


})

Is there anything I can do to fix this error?

The normal function: $('#editor').trumbowyg('html', '{!! $document->old_version !!}'); is working fine so the order of loading the javascript files should be correct, but the kind of this error speeks against this.


Solution

  • Solution was adding $.noConflict(); to the first line after the definition of the function inside of the document ready call.