Updated the JavaScript associated with the search page to

control whether the 'search' button is enabled or not. It is
now enabled if either the main search box has input, or if
any of the sub-options have input, or both.

Note that the Yahoo! widgets we were using did weird things 
to the button name, so I disabled that. This changes the
look and feel of the button - that may be a contenious issue.
OTOH, I think that this is probably a good thing, since this
is the only place where we override the user's default 
appearance settings.

Another possible issue is the use of JavaScript without
JQuery. The existing code here did not use JQuery, so I 
decided to simply extend it.

See the Trac ticket ietf-tools#480 for more.

http://trac.tools.ietf.org/tools/ietfdb/ticket/480
 - Legacy-Id: 2958

Author: shane-kerr

shane/ietf/idrfc/views_search.py

@@ -42,20 +42,34 @@
 from ietf.idrfc.idrfc_wrapper import IdWrapper,RfcWrapper,IdRfcWrapper
 from ietf.utils import normalize_draftname
 
+def addInputEvents(widget):
+    widget.attrs["oninput"] = 'inputEvent()'
+    widget.attrs["onpropertychange"] = 'propertyChange()'
+
+def addChangeEvent(widget):
+    widget.attrs["onchange"] = 'changeEvent()'
+
 class SearchForm(forms.Form):
     name = forms.CharField(required=False)
+    addInputEvents(name.widget)
     rfcs = forms.BooleanField(required=False,initial=True)
     activeDrafts = forms.BooleanField(required=False,initial=True)
     oldDrafts = forms.BooleanField(required=False,initial=False)
     lucky = forms.BooleanField(required=False,initial=False)
 
     by = forms.ChoiceField(choices=[(x,x) for x in ('author','group','area','ad','state')], required=False, initial='wg', label='Foobar')
     author = forms.CharField(required=False)
+    addInputEvents(author.widget)
     group = forms.CharField(required=False)
+    addInputEvents(group.widget)
     area = forms.ModelChoiceField(Area.active_areas(), empty_label="any area", required=False)
+    addChangeEvent(area.widget)
     ad = forms.ChoiceField(choices=(), required=False)
+    addChangeEvent(ad.widget)
     state = forms.ModelChoiceField(IDState.objects.all(), empty_label="any state", required=False)
+    addChangeEvent(state.widget)
     subState = forms.ChoiceField(choices=(), required=False)
+    addChangeEvent(subState.widget)
 
     def __init__(self, *args, **kwargs):
         super(SearchForm, self).__init__(*args, **kwargs)

shane/ietf/templates/idrfc/search_form.html

@@ -77,39 +77,42 @@
 
 <div style="padding-top:0.5em;">
 {# <input type="hidden" name="ajax" value="" /> #}
-<span id="search_submit_button" class="yui-button yui-submit-button">
 <span class="first-child">
-<button type="submit" id="search_submit">Search</button>
-</span>
+<button type="submit" name="search_submit" id="id_search_submit">Search</button>
 </span>
 </div>
 
 </form>
 
 <script type="text/javascript">
 //<![CDATA[
-{% comment %}
-function searchResult(o) {
-    var el = document.getElementById("search_results");
-    el.innerHTML = (o.responseText !== undefined) ? o.responseText : "?";
+// we want to disable our submit button if we have no search text, 
+// and we have no advanced options selected
+function toggleSubmit() {
+    var button = document.getElementById("id_search_submit");
+    var by = findCheckedSearchBy();
+    var value = findSearchByValue(by);
+    var text = document.getElementById("id_name");
+    if ((value == "") && (text.value == "")) {
+        button.disabled = true;
+    } else {
+        button.disabled = false;
+    }
 }
 
-function searchFailure(o) {
-    var el = document.getElementById("search_results");
-    el.innerHTML = "Error: "+o.status+" "+o.statusText;
+// check our button status after every change to text fields
+// Internet Explorer uses 'onpropertychange', everyone else 'oninput'
+function inputEvent(event) {
+    toggleSubmit();
+}
+function propertyChange() {
+    toggleSubmit();
 }
 
-function submitSearch() {
-    document.getElementById("search_results").innerHTML = "Searching...";
-    document.search_form.ajax.value = "1";
-    YAHOO.util.Connect.setForm("search_form");
-    YAHOO.util.Connect.asyncRequest('POST', '/doc/search/',
-        { success: searchResult,
-          failure: searchFailure,
-          argument: null
-	}, null);
+// check our button status after every change to selection pulldowns
+function changeEvent(event) {
+    toggleSubmit();
 }
-{% endcomment %}
 
 function togglePlusMinus(id) {
     var el = document.getElementById(id);
@@ -123,7 +126,7 @@
     }
 }
 
-function changeBy() {
+function findCheckedSearchBy() {
     var by=''; 
     var f = document.search_form;
     for (var i = 0; i < f.by.length; i++) {
@@ -132,6 +135,27 @@
             break; 
         }
     }
+    return by;
+}
+
+function findSearchByValue(by) {
+    if (by == 'author') { return document.getElementById("id_author").value; }
+    if (by == 'group') { return document.getElementById("id_group").value; }
+    if (by == 'area') { return document.getElementById("id_area").value; }
+    if (by == 'ad') { return document.getElementById("id_ad").value; }
+    if (by == 'state') { 
+        // state might be state...
+        state_value = document.getElementById("id_state").value;
+        if (state_value) { return state_value; }
+        // ...or sub-state
+        return document.getElementById("id_subState").value;
+    }
+    return '';
+}
+
+function changeBy() {
+    var by=findCheckedSearchBy();
+    var f = document.search_form;
     f.author.disabled=true;  
     f.group.disabled=true;
     f.area.disabled=true;
@@ -142,6 +166,8 @@
     if (by=='area') { f.area.disabled=false;}
     if (by=='ad') { f.ad.disabled=false; }
     if (by=='state') { f.state.disabled=false; f.subState.disabled=false; }
+ 
+    toggleSubmit();
 }
 
 function toggleAdvanced() {