Materialise - Compteur de caractères

Exemple

L'exemple suivant illustre le contrôle de Materialize Character Counter. La définition de la longueur de saisie de texte ou de zone de texte active ce contrôle.

materialize_charactercounter.htm

<html>
   <head>
      <title>The Materialize DatePicker Example</title>
      <meta name = "viewport" content = "width = device-width, initial-scale = 1">      
      <link rel = "stylesheet"
         href = "https://fonts.googleapis.com/icon?family=Material+Icons">
      <link rel = "stylesheet"
         href = "https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.3/css/materialize.min.css">
      <script type = "text/javascript"
         src = "https://code.jquery.com/jquery-2.1.1.min.js"></script>           
      <script src = "https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.3/js/materialize.min.js">
      </script> 
   </head>
   
   <body class = "container">   
      <div class = "row">
         <form class = "col s12">
            <div class = "row">
               <div class = "input-field col s6">
                  <input id = "name" type = "text" length = "10" />
                  <label for = "name">Enter Name</label>
               </div>          
            </div>
            
            <div class = "row">
               <div class = "input-field col s6">
                  <textarea id = "comments" class = "materialize-textarea" length = "120">
                  </textarea>
                  <label for = "comments">Comments</label>
               </div>          
            </div>    			
         </form>       
      </div>
   </body>   
</html>

Résultat

Vérifiez le résultat.