| <!DOCTYPE html> |
| <html> |
| <!-- |
| Copyright 2010 The Closure Library Authors. All Rights Reserved. |
| |
| Use of this source code is governed by the Apache License, Version 2.0. |
| See the COPYING file for details. |
| --> |
| <head> |
| <title>goog.ui.CharCounter</title> |
| <script src="../base.js"></script> |
| <script> |
| goog.require('goog.dom'); |
| goog.require('goog.ui.CharCounter'); |
| goog.require('goog.ui.CharCounter.Display'); |
| </script> |
| <link rel="stylesheet" href="css/demo.css"> |
| </head> |
| <body> |
| <h1>goog.ui.CharCounter</h1> |
| |
| <p> |
| <input type="text" id="input1"> |
| <span id="counter1"></span> character(s) remaining |
| </p> |
| <p> |
| <input type="text" id="input2"> |
| You have entered <span id="counter2"></span> character(s) of a maximum 160. |
| </p> |
| <p> |
| <input type="text" id="input3"> |
| <span id="counter3"></span> character(s) remaining |
| <button onclick="c3.setMaxLength(10);">setMaxLength(10)</button> |
| <button onclick="c3.setMaxLength(20);">setMaxLength(20)</button> |
| </p> |
| <p> |
| <textarea id="input4"></textarea> |
| <span id="counter4"></span> character(s) remaining |
| </p> |
| |
| <script> |
| |
| var c1 = new goog.ui.CharCounter(document.getElementById('input1'), |
| document.getElementById('counter1'), 160); |
| |
| var c2 = new goog.ui.CharCounter(document.getElementById('input2'), |
| document.getElementById('counter2'), 160, |
| goog.ui.CharCounter.Display.INCREMENTAL); |
| |
| var c3 = new goog.ui.CharCounter(document.getElementById('input3'), |
| document.getElementById('counter3'), 10); |
| |
| var c4 = new goog.ui.CharCounter(document.getElementById('input4'), |
| document.getElementById('counter4'), 255); |
| </script> |
| </body> |
| </html> |
