Is there a PageDown plugin for Jeditable?

I am using jQuery built-in Jeditable editing plugin . Fortunately, Jeditable provides a plug -in capability to extend the inline editing built into it.

I'm hoping not to reinvent the wheel - is there already a PageDown plugin for Jeditable? If someone does my google-fu it doesn't bring any results.


source to share

1 answer

I never found a Jeditable PageDown plugin out of the box, so I wrote my own. The example below is too specific to be used without modification, but it should provide a reasonably suitable outline for anyone trying to accomplish a similar task.

Code to add markdown input type to Jeditable:

var converter = Markdown.getSanitizingConverter();

$.editable.addInputType('markdown', {
    element: function(settings, original) {
        var editorId ="-"));
        var input = $('<textarea />');
        input.attr('id', 'wmd-input' + editorId);

        var panel = $('<div class="wmd-panel" />');
        panel.append('<div id="wmd-button-bar' + editorId + '" />');
        panel.append('<div id="wmd-preview' + editorId + '" />');

        return (input);
    plugin: function(settings, original) {
        var editorId ="-"));
        var editor = new Markdown.Editor(converter, editorId);;


The above code goes through heaps of circles regarding element ids, because in my case, I might have multiple editors on the same page. See the Documentation Documentation about Markdown.Editor for more information .

Once I added the "markdown" input type to Jeditable, it's just a matter of using this code:

$('.editable-element-area').editable('', {
    onblur: 'submit',
    type: 'markdown',
    indicator: 'Saving...',
    loadurl: '', // retrieve existing markdown
    callback: function(value, settings) {
        $(this).html(converter.makeHtml(value)); // render updated markdown


I want my users to see the markdown as HTML when they are not editing it, so I have to use the Jeditable parameters callback and loadurl . The download url retrieves the text for editing in markdown format, and the callback converts the new text back to html.



All Articles