Add Javascript to disable the submit button until all required form fields have been filled in.

2004-12-28 15:19:32 +00:00 · 2004-12-28 15:19:32 +00:00 · 15ad825d50
--- a/webtools/hendrix/template/error.html.tmpl
+++ b/webtools/hendrix/template/error.html.tmpl
@ -31,7 +31,8 @@
 [% SWITCH error %]
  [% CASE "bad_parameters" %]
    <p class="error">
-      You need to give both your name and a summary of your feedback.
+      You need to fill in all the required fields - name, product, summary 
+      and your actual feedback.
    </p>
  
    <p>Please press Back and fill in the missing field(s).</p>
--- a/webtools/hendrix/template/header.html.tmpl
+++ b/webtools/hendrix/template/header.html.tmpl
@ -29,9 +29,12 @@
  <head>
    <title>[% title %]</title>
    <link rel="stylesheet" href="hendrix.css">
+    <script language="JavaScript" type="text/javascript">
+      [% script %]
+    </script>
  </head>
  
-  <body>
+  <body onload="[% onload %]">
  <img id="header-img" src="hendrix.jpg">
  [% IF NOT h1 AND title %]
    [% h1 = title %]
--- a/webtools/hendrix/template/index.html.tmpl
+++ b/webtools/hendrix/template/index.html.tmpl
@ -22,8 +22,42 @@
  #
  # ***** END LICENSE BLOCK ***** %]
  
+[% script = BLOCK %]
+var ids = ["name", "subject", "comments", "product"];
+
+function checkSubmitEnable() {
+  /* To enable the button, all fields must have a value */
+  var enable = true;
+  
+  for (var i = 0; i < ids.length; i++) {
+    if (document.getElementById(ids[i]).value == "") {
+      enable = false;
+      break;
+    }  
+  }
+  
+  if (enable) {
+    document.getElementById("send-feedback").removeAttribute("disabled");  
+  }
+  else {  
+    document.getElementById("send-feedback").setAttribute("disabled", "true");
+  }
+}
+
+function onLoad() {
+  /* Add the event listeners, and disable the button initially */
+  for (var i = 0; i < ids.length; i++) {
+    document.getElementById(ids[i]).setAttribute("onkeyup",  
+                                                 "checkSubmitEnable()");
+  }
+  
+  checkSubmitEnable();
+}  
+[% END %]
+  
 [% PROCESS header.html.tmpl 
-   title = "Hendrix - mozilla.org Feedback System" 
+   title = "Hendrix - mozilla.org Feedback System"
+   onload = "onLoad()"
 %]

 <p>This is Hendrix - the mozilla.org system for leaving quick and general feedback. If you have a specific and detailed bug report, please file it in