Character Remaining for p:editor Primefaces

Question

I am aware that Primefaces provides functionality for character remaining for p:inputTextarea as shown in the code below

<p:inputTextarea rows="1" cols="85" counter="counter" maxlength="100" counterTemplate="{0} characters remaining" value="#{managedBean.inputvalue}" ></p:inputTextarea>
<h:outputText />
<h:outputText id="counter" />

But I want to do the same thing in p:editor. How to do that? Is primefaces provides such functionality or do I have to achieve this by other means {like coding this functinality}.

TIA

Answer 1

<p:editor has no option for that, you can use jquery to solve that. My solution is bind keyup event to your editor I have just tested, my example have one form(id: fm), one editor(id:rongnk),one outputtext(id:txt):

<h:body onload="bindiframe()">
        <h:form id="fm"> 
            <p:editor id="rongnk" value="xxx">
            </p:editor>
            <h:outputText id="txt"/>
            <script type="text/javascript">
                var imax = 50;
                function bindiframe(){
                    $('#fm\\:rongnk').find('iframe').contents().find("body").on('keyup', function(e) {
                        ilength = $('#fm\\:rongnk').find('iframe').contents().find("body").text().length;
                        $('#fm\\:txt').html('Remain:' + (imax - ilength));
                    });
                }
            </script>
        </h:form>
    </h:body>

Answer 2

As far as I can judge from documentation of <p:editor> tag there is no attribute with a 'counter' functionality. Still, there is maxlength attribute.

So, your best bet is to attach a JavaScript function to handle change event by specifying onchange="checkTextLength(this)". To write the function, you need to calculate the difference between max text length and current text length with PrimeFaces' editor client side API and basing on the result update a placeholder.