Don't like ads? PRO users don't see any ads ;-)
Public Pastes
Guest

Untitled

By: a guest on Jun 17th, 2012  |  syntax: None  |  size: 1.00 KB  |  hits: 18  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. Progress bar in webform
  2. <html>
  3. <head>
  4. <script type="text/javascript">
  5.     function check() {
  6.         var completion = 0;
  7.         if (document.getElementById("field1").value != "") {
  8.             completion++;
  9.         }
  10.         if (document.getElementById("field2").value != "") {
  11.             completion++;
  12.         }
  13.         if (document.getElementById("field3").value != "") {
  14.             completion++;
  15.         }
  16.         document.getElementById("progressbar").style.width = completion*20+"px";
  17.     }
  18. </script>
  19. </head>
  20. <body>
  21. <form action="script.aspx" method="GET">
  22.     Name: <input type="text" id="field1" onchange="check()" /><br />
  23.     Tel No.: <input type="text" id="field2" onchange="check()" /><br />
  24.     Email: <input type="text" id="field3" onchange="check()" /><br />
  25.     Completion: <div style="width: 60px; height: 10px; border: 1px solid black;">
  26.         <div style="width: 0px; height: 10px; background-color: green;" id="progressbar">&nbsp;</div>
  27.     </div>
  28.     <input type="submit" />
  29. </form>
  30. </body>
  31. </html>
create a new version of this paste RAW Paste Data