1

I've made my own upload library dialog with Semantic UI's modal. I'm trying to integrate this dialog within the Pagedown editor.

var converter = Markdown.getSanitizingConverter();
var editor = new Markdown.Editor(converter);

editor.hooks.set("insertImageDialog", function(callback) {
    uploadModal.load(); // The dialog HTML gets loaded asynchronously

    $('body').on('selection', '.upload-modal', function(e, src) {
        console.log(src);
        callback(src);
    });

    return true; // tell the editor that we'll take care of getting the image url
});

Everything works fine the first time selecting an image from the dialog, but after that it breaks:

Uncaught TypeError: Cannot call method 'removeChild' of null Markdown.Editor.js

According to this SO question it has something to do with defining the event handler multiple times, but I can't wrap my head around it.

Some more info:

The HTML for initializing the modal is loaded asynchronously, here is the JS code:

var uploadModal = (function() {

    /**
     * Load the upload modal.
     */
    this.load = function() {
        var $modal = $('.upload-modal');

        if ($modal.length) {
            // Show the already existing modal.
            $modal.modal('show');
        } else {
            // Get the HTML
            var request = $.get(appUrl('admin/upload/modal'));

            request.done(function(html) {
                // Make the modal.
                var $modal = $(html);

                $modal.modal({
                    observeChanges: true,
                    onApprove: function () {
                        var upload = $modal.find('.selected.upload'),
                            src = upload.find('.image > img').attr('src');

                        // Bind the event listener which will return the upload's source URL
                        $modal.trigger('selection', src);

                        return true;
                    }
                }).modal('show');

                // Some event handlers here    
            });
        }
    };
})();

I load the modal by calling uploadModal.load() and watch whenever an image is selected by attaching the 'selection' event handler.

Community
  • 1
  • 1
JasonK
  • 5,214
  • 9
  • 33
  • 61
  • I had a problem similar to yours, mine worked once. then the second time dint work. problem might be here `$('body').on('selection', '.upload-modal', function(e, src) {...` http://stackoverflow.com/questions/39562057/pagedown-markdown-script-inserts-image-url-once – Omari Victor Omosa Sep 19 '16 at 06:46

0 Answers0