开发者

Jeditable with TinyMCE and a Character Count/limiter

开发者 https://www.devze.com 2023-03-17 04:08 出处:网络
I\'ve been trying to fathom this all day but no joy.... you are my only hope oni wan konobi! I\'ve looked at the max_chars plugin for TinyMCE which works fine if TinyMCE is implemented on its own.

I've been trying to fathom this all day but no joy.... you are my only hope oni wan konobi!

I've looked at the max_chars plugin for TinyMCE which works fine if TinyMCE is implemented on its own.

Jeditable also has an ability to count/limit characters using a custom type. See here: http://www.appelsiini.net/projects/jeditable/custom.html Again this works great if its implemented on its own.

I need to implement TinyMCE with Jeditable. Which I've managed and it works great. But in order to do this there had to be a custom type for TinyMCE.

Here is my code for that type:

$.editable.addInputType('mce', {
element : function(settings, original) {
    var textarea = $('<textarea id="'+$(original).attr("id")+'_mce"/>');
    if (settings.rows) {
       textarea.attr('rows', settings.rows);
    } else {
       textarea.height(settings.height);
    }
    if (settings.cols) {
       textarea.attr('cols', settings.cols);
    } else {
       textarea.width(settings.width);
    }
    $(this).append(textarea);
       return(textarea);
    },
    plugin : function(settings, original) {
       tinyMCE.execCommand("mceAddControl", true, $(original).attr("id")+'_mce');

       },
    submit : function(settings, original) {
       tinyMCE.triggerSave();
       tinyMCE.execCommand("mceRemoveControl", true, $(original).attr("id")+'_mce');
       },
    reset : function(settings, original) {
       tinyMCE.execCommand("mceRemoveControl", true, $(original).attr("id")+'_mce');
       original.reset();
}
});

Here is the code for Jeditable character counter:

$.editable.addInputType('charcounter', {
element : function(settings, original) {
    var textarea = $('<textarea />');
    if (settings.rows) {
        textarea.attr('rows', settings.rows);
    } else {
        textarea.height(settings.height);
    }
    if (settings.cols) {
        textarea.attr('cols', settings.cols);
    } else {
        textarea.width(settings.width);
    }
    $(this).append(textarea);
    return(textarea);
},
plugin : function(settings, original) {
    $('textarea', this).charCounter(settings.charcounter.characters,   settings.charcounter);
}
});

Is there anyway to get these 2 working together?? In an ideal world I would just be able to call 2 types. My calling code is:

$(function(){
   $(".editable_profbod").editable('save.asp?PageID=<%=PageID%>&SectionID=1',
    {
      type : 'mce',
  indicator : 'Sa开发者_Go百科ving...',
      tooltip : 'Click to edit...',
      name : 'note_text',
      submit : 'OK',
      cancel : 'Cancel',
      height : '100px',
  onblur: 'ignore',
  cssclass: 'editable'
   });

Is there any way to merge these 2 types?? I just really badly need to limit and show the number of characters. Ideally I want to use the jeditable way of showing and limiting the count.

Many thanks, Dave


You might be open to another way of solution: You can write your own plugin which takes care of this. It would be pretty simple. Here is a link to a howto write a tinymce plugin. All you will need to do is to act onKeyDown to get the Content and count the characters. Depending on the value you may stop the insertion of characters typed.

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号