Refactor search logic to trigger with jQuery instead of inserting

attributes directly, moving it to a separate JS file; fixes a bug in
the new schema
 - Legacy-Id: 3927
This commit is contained in:
Ole Laursen 2012-02-15 15:15:33 +00:00
parent 1756491cf1
commit 9c06587c74
6 changed files with 104 additions and 125 deletions

View file

@ -43,16 +43,8 @@ from ietf.idrfc.idrfc_wrapper import IdWrapper,RfcWrapper,IdRfcWrapper
from ietf.utils import normalize_draftname
from django.conf import settings
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)
@ -60,18 +52,12 @@ class SearchForm(forms.Form):
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)
self.fields['ad'].choices = [('', 'any AD')] + [(ad.id, "%s %s" % (ad.first_name, ad.last_name)) for ad in IESGLogin.objects.filter(user_level=1).order_by('last_name')] + [('-99', '------------------')] + [(ad.id, "%s %s" % (ad.first_name, ad.last_name)) for ad in IESGLogin.objects.filter(user_level=2).order_by('last_name')]
@ -275,7 +261,6 @@ if settings.USE_DB_REDESIGN_PROXY_CLASSES:
class SearchForm(forms.Form):
name = forms.CharField(required=False)
addInputEvents(name.widget) # consider moving this to jQuery client-side instead
rfcs = forms.BooleanField(required=False,initial=True)
activeDrafts = forms.BooleanField(required=False,initial=True)
oldDrafts = forms.BooleanField(required=False,initial=False)
@ -283,17 +268,11 @@ if settings.USE_DB_REDESIGN_PROXY_CLASSES:
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(Group.objects.filter(type="area", state="active").order_by('name'), empty_label="any area", required=False)
addInputEvents(area.widget)
ad = forms.ChoiceField(choices=(), required=False)
addInputEvents(ad.widget)
state = forms.ModelChoiceField(State.objects.filter(type="draft-iesg"), empty_label="any state", required=False)
addInputEvents(state.widget)
subState = forms.ChoiceField(choices=(), required=False)
addInputEvents(subState.widget)
def __init__(self, *args, **kwargs):
super(SearchForm, self).__init__(*args, **kwargs)

View file

@ -102,6 +102,7 @@ YAHOO.util.Event.onContentReady("wgs", function () {
//]]>
</script>
<script type="text/javascript" src="/js/base.js"></script>
{% block js %}{% endblock %}
{% block content_end %}
{% endblock %}

View file

@ -82,3 +82,7 @@ YAHOO.util.Event.onContentReady("search_submit_button", function () {
var oButton = new YAHOO.widget.Button("search_submit_button", {});
});
{% endblock scripts %}
{% block js %}
<script type="text/javascript" src="/js/doc-search.js"></script>
{% endblock %}

View file

@ -47,25 +47,25 @@ OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
</table>
</div>
<span onclick="toggleAdvanced();"><b><img src="/images/{% if meta.advanced %}minus{% else %}plus{% endif %}.png" alt="" id="search_advanced-img" /> Advanced</b></span>
<span class="toggle_advanced"><b><img src="/images/{% if meta.advanced %}minus{% else %}plus{% endif %}.png" alt="" id="search_advanced-img" /> Advanced</b></span>
<div id="search_advanced" style="{% if not meta.advanced %}display:none;{%endif%}margin-top:1em;">
Additional search criteria:
<div class="search_field">
<label><input type="radio" class="radio" name="by" value="author" {% ifequal meta.by "author" %}checked="checked"{% endifequal %} onclick="changeBy();"/> Author (last name):</label> {{ form.author }}
<label><input type="radio" class="radio" name="by" value="author" {% ifequal meta.by "author" %}checked="checked"{% endifequal %}/> Author (last name):</label> {{ form.author }}
</div>
<div class="search_field">
<label><input type="radio" class="radio" name="by" value="group" {% ifequal meta.by "group" %}checked="checked"{% endifequal %} onclick="changeBy();"/> WG:</label> {{ form.group }}
<label><input type="radio" class="radio" name="by" value="group" {% ifequal meta.by "group" %}checked="checked"{% endifequal %}/> WG:</label> {{ form.group }}
</div>
<div class="search_field">
<label><input type="radio" class="radio" name="by" value="area" {% ifequal meta.by "area" %}checked="checked"{% endifequal %} onclick="changeBy();"/> Area:</label> {{ form.area }}
<label><input type="radio" class="radio" name="by" value="area" {% ifequal meta.by "area" %}checked="checked"{% endifequal %}/> Area:</label> {{ form.area }}
</div>
<div class="search_field">
<label><input type="radio" class="radio" name="by" value="ad" {% ifequal meta.by "ad" %}checked="checked"{% endifequal %} onclick="changeBy();"/> Responsible AD:</label> {{ form.ad }}
<label><input type="radio" class="radio" name="by" value="ad" {% ifequal meta.by "ad" %}checked="checked"{% endifequal %}/> Responsible AD:</label> {{ form.ad }}
</div>
<div class="search_field">
<label><input type="radio" class="radio" name="by" value="state" {% ifequal meta.by "state" %}checked="checked"{% endifequal %} onclick="changeBy();"/> IESG State:</label> {{ form.state }} :: {{ form.subState }}
<label><input type="radio" class="radio" name="by" value="state" {% ifequal meta.by "state" %}checked="checked"{% endifequal %}/> IESG State:</label> {{ form.state }} :: {{ form.subState }}
</div>
{% comment %}
<div class="search_field" style="text-decoration:line-through;color:#808080;">
@ -83,100 +83,3 @@ Additional search criteria:
</div>
</form>
<script type="text/javascript">
//<![CDATA[
// 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;
}
}
// check our button status after every change to text fields
// Internet Explorer uses 'onpropertychange', everyone else 'oninput'
function inputEvent(event) {
toggleSubmit();
}
function propertyChange() {
toggleSubmit();
}
// check our button status after every change to selection pulldowns
function changeEvent(event) {
toggleSubmit();
}
function togglePlusMinus(id) {
var el = document.getElementById(id);
var imgEl = document.getElementById(id+"-img");
if (el.style.display == 'none') {
el.style.display = 'block';
imgEl.src = "/images/minus.png";
} else {
el.style.display = 'none';
imgEl.src = "/images/plus.png";
}
}
function findCheckedSearchBy() {
var by='';
var f = document.search_form;
for (var i = 0; i < f.by.length; i++) {
if (f.by[i].checked) {
by = f.by[i].value;
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;
f.ad.disabled=true;
f.state.disabled=true; f.subState.disabled=true;
if (by=='author') { f.author.disabled=false;}
if (by=='group') { f.group.disabled=false;}
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() {
togglePlusMinus("search_advanced");
var f = document.search_form;
for (var i = 0; i < f.by.length; i++) { f.by[i].checked = false; }
changeBy();
}
changeBy();
//]]>
</script>

View file

@ -53,3 +53,7 @@ YAHOO.util.Event.onContentReady("search_submit_button", function () {
var oButton = new YAHOO.widget.Button("search_submit_button", {});
});
{% endblock scripts %}
{% block js %}
<script type="text/javascript" src="/js/doc-search.js"></script>
{% endblock %}

88
static/js/doc-search.js Normal file
View file

@ -0,0 +1,88 @@
$(function () {
var form = jQuery("#search_form");
form.find(".search_field").click(function () {
changeBy();
});
form.find(".search_field").find("input,select")
.change(toggleSubmit).click(toggleSubmit).keyup(toggleSubmit);
form.find(".toggle_advanced").click(function () {
togglePlusMinus("search_advanced");
form.find('.search_field input[type="radio"]').attr("checked", false);
changeBy();
});
changeBy();
// 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 togglePlusMinus(id) {
var el = document.getElementById(id);
var imgEl = document.getElementById(id+"-img");
if (el.style.display == 'none') {
el.style.display = 'block';
imgEl.src = "/images/minus.png";
} else {
el.style.display = 'none';
imgEl.src = "/images/plus.png";
}
}
function findCheckedSearchBy() {
var by='';
var f = document.search_form;
for (var i = 0; i < f.by.length; i++) {
if (f.by[i].checked) {
by = f.by[i].value;
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;
f.ad.disabled=true;
f.state.disabled=true; f.subState.disabled=true;
if (by=='author') { f.author.disabled=false;}
if (by=='group') { f.group.disabled=false;}
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();
}
});