Auto increament Text Area Field Size

Issue – Displaying number of characters remaining on 'Text Area Field' for custom field in the VF Page similar to standard out of box functionality.

 Solution – We need java script to implement it.

       We are passing id of custom field in function size as first parameter and as second parameter we are passing the size of custom field i.e. In above case we are passing the size as 10000 so at the point of first character it displays message 9999 characters remaining and so on...and it doesn't allow to enter more than 10000 characters, as third parameter we are passing id of div where we need to display message.

 Code:

<apex:page standardController="Case">

<script>

function size(fvalue, size, divid) {

       var input_field = document.getElementById(fvalue);

       var msg_count = document.getElementById(divid);

       var char_reamining = '0';

       var char_entered = input_field.value.length;  

       if(char_entered == 0){

        msg_count.innerHTML = '';

        msg_count.style.background = '#F7F7F7';

       }else {

       if(char_entered <= size){    

         char_reamining = size - char_entered;

         msg_count.innerHTML = char_reamining+ ' remaining';

         msg_count.style.background = 'yellow';

        }else{

          msg_count.innerHTML = char_reamining + ' remaining';

          msg_count.style.background = 'yellow';

          input_field.value = input_field.value.substring(0,size);    

      } } }

</script>

 <!—Call the java Script above code in input field-- >

  <apex:form >

  <div id="msg" class="ErrorMessageClass">

   </div>

    <apex:inputField value="{!Case.Problem_Descriptions__c}" style="width:900px" onkeyup="javascript:size('{!$Component.formId:pgBlockId:pbs1:tdescription}',10000,'msg');" id="tdescription" />

</apex:form>

</apex:page>