PrimeFaces inputTextarea counterTemplate中使用和總字符數

我有一個關於primefaces的問題。我有一個文本框，我需要該文本框中的字符限制以及輸出文本給出當前的字符狀態。PrimeFaces inputTextarea counterTemplate中使用和總字符數

目前，我的櫃檯看起來是這樣的：

，而不是一個字符數下來，我寧願一個計數了。更像「使用32/50個字符」的東西。

這裏是代碼位我沒有做這樣的：

<p:inputTextarea id="recommendedToolsOther" rows="4" 
    style="vertical-align: top; width: 98% !important;" styleClass="preformatted" 
    autoResize="false" value="#{rfeBean.rfe.otherRecommendedTools}" 
    disabled="#{!rfeBean.recommendedToolsChecked[ReferralTemplateConstants.RECOMMENDED_TOOLS_HAND_OTHER]}" 
    counter="displayRecTools" maxlength="50" 
    counterTemplate="{0} characters remaining"> 
    <p:ajax event="change" update="recommendedToolsOther"/> 
</p:inputTextarea> 
<br/> 
<h:outputText id="displayRecTools" />

我有我怎麼能做到這一點的想法。表示剩餘字符數的變量由R表示。所用字符的數量由U表示。
我需要這樣做：U =（C-50）*（ - 1）

I我不確定如何在primefaces上做這樣的代數。

來源

2017-03-17 Liam Paquette

我不認爲它可能與PF反...如果你想退回到jQuery的這個工作對我來說：

<p:inputTextarea id="textarea" maxlength="20" onfocus="updateCount()" onkeyup="updateCount()"/> 
<div id="counter"/>

與

<script> 
    function updateCount() { 
     $("[id$='counter']").html($("[id$='textarea']").val().length + "/" + $("[id$='textarea']").attr('maxlength') + " characters used"); 
    } 
</script>

來源

2017-03-18 09:15:55

這是'可能'，看到我的答案，但我反正這個答案;-)好奇OP將接受哪個答案。在這之後他有兩次重試......怪異的 – Kukeltje

這可以通過簡單重寫updateCounter function of the PrimeFaces 'inputTextarea'小部件來完成：

與

var remainingText = this.cfg.counterTemplate.replace('{0}', remaining).replace('{1}', length).replace('{2}', this.cfg.maxlength);

更換

var remainingText = this.cfg.counterTemplate.replace('{0}', remaining);

會給你使用{1}對於所使用的長度和{2}爲配置的最大長度的選項。

的counterTemplate的一個例子是

"This textArea has used {1} of {2} characters, so {0} are remaining"

所以全功能超控成爲

PrimeFaces.widget.InputTextarea.prototype.updateCounter = function() { 
    var value = this.normalizeNewlines(this.jq.val()), 
    length = value.length; 

    if(this.counter) { 
     var remaining = this.cfg.maxlength - length; 
     if(remaining < 0) { 
      remaining = 0; 
     } 

     var remainingText = this.cfg.counterTemplate.replace('{0}', remaining).replace('{1}', length).replace('2', this.cfg.maxlength); 

     this.counter.html(remainingText); 
    } 
}

包含此在正確的位置，以取代舊，也將努力

Soooo易於使用的源尋找解決方案...

來源

2017-04-27 22:12:19 Kukeltje

+1。我認爲值得在Git上打開一個問題。它將消除創建解決方法或硬編碼以顯示最大長度的需要。 –

@JasperDeVries：這個週末我會做 – Kukeltje

哇......我覺得我得到了一個人的讚譽，這個人創造了一個壞的答案（我低估了）在同一張海報上的另外兩個幾乎相同的問題...很酷！ – Kukeltje

PrimeFaces inputTextarea counterTemplate中使用和總字符數

回答

相關問題