Fixed #105 -- collapsable fieldsets now work in both ways (thanks, Simon)
git-svn-id: http://code.djangoproject.com/svn/django/trunk@387 bcc190cf-cafb-0310-a4f2-bffc1f526a37
This commit is contained in:
parent
b3b27d2593
commit
623863d0a4
|
@ -228,10 +228,9 @@ form .wide p.help { padding-left:38px; }
|
||||||
/* COLLAPSED FIELDSETS */
|
/* COLLAPSED FIELDSETS */
|
||||||
|
|
||||||
fieldset.collapsed * { display:none; }
|
fieldset.collapsed * { display:none; }
|
||||||
fieldset.collapsed h2, fieldset.collapsed .collapse-toggle { display:block !important; }
|
fieldset.collapsed h2, fieldset.collapsed { display:block !important; }
|
||||||
|
fieldset.collapsed .collapse-toggle { display: inline !important; }
|
||||||
fieldset.collapsed h2 { background-image:url(../img/admin/nav-bg.gif); background-position:bottom left; color:#999; }
|
fieldset.collapsed h2 { background-image:url(../img/admin/nav-bg.gif); background-position:bottom left; color:#999; }
|
||||||
fieldset.collapsed .collapse-toggle { padding:3px 5px !important; background:#efefef; }
|
|
||||||
fieldset.collapsed .collapse-toggle a { display:inline !important; }
|
|
||||||
|
|
||||||
/* MESSAGES & ERRORS */
|
/* MESSAGES & ERRORS */
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
// Finds all fieldsets with class="collapse", collapses them, and gives each
|
// Finds all fieldsets with class="collapse", collapses them, and gives each
|
||||||
// one a "Show foo" link that uncollapses it.
|
// one a "Show" link that uncollapses it. The "Show" link becomes a "Hide"
|
||||||
|
// link when the fieldset is visible.
|
||||||
|
|
||||||
function findForm(node) {
|
function findForm(node) {
|
||||||
// returns the node of the form containing the given node
|
// returns the node of the form containing the given node
|
||||||
|
@ -16,35 +17,25 @@ var CollapsedFieldsets = {
|
||||||
init: function() {
|
init: function() {
|
||||||
var fieldsets = document.getElementsByTagName('fieldset');
|
var fieldsets = document.getElementsByTagName('fieldset');
|
||||||
var collapsed_seen = false;
|
var collapsed_seen = false;
|
||||||
for (var i=0; i<fieldsets.length; i++) {
|
for (var i = 0, fs; fs = fieldsets[i]; i++) {
|
||||||
var fs = fieldsets[i];
|
|
||||||
// Collapse this fieldset if it has the correct class, and if it
|
// Collapse this fieldset if it has the correct class, and if it
|
||||||
// doesn't have any errors. (Collapsing shouldn't apply in the case
|
// doesn't have any errors. (Collapsing shouldn't apply in the case
|
||||||
// of error messages.)
|
// of error messages.)
|
||||||
if (fs.className.match(CollapsedFieldsets.collapse_re) && !CollapsedFieldsets.fieldset_has_errors(fs)) {
|
if (fs.className.match(CollapsedFieldsets.collapse_re) && !CollapsedFieldsets.fieldset_has_errors(fs)) {
|
||||||
|
|
||||||
collapsed_seen = true;
|
collapsed_seen = true;
|
||||||
|
|
||||||
// Give it an additional class, used by CSS to hide it.
|
// Give it an additional class, used by CSS to hide it.
|
||||||
fs.className += ' ' + CollapsedFieldsets.collapsed_class;
|
fs.className += ' ' + CollapsedFieldsets.collapsed_class;
|
||||||
|
// (<a id="fieldsetcollapser3" class="collapse-toggle" href="#">Show</a>)
|
||||||
// Get plural verbose name of object.
|
|
||||||
var verbose_name = fs.getElementsByTagName('h2')[0].innerHTML;
|
|
||||||
|
|
||||||
// <div class="form-row collapse-toggle" id="fieldsetcollapser1">
|
|
||||||
// <a href="javascript:toggleDisplay;">Show section priorities…</a>
|
|
||||||
// </div>
|
|
||||||
var div = document.createElement('div');
|
|
||||||
|
|
||||||
// Give it a hook so we can remove it later.
|
|
||||||
div.id = 'fieldsetcollapser' + i;
|
|
||||||
|
|
||||||
div.className = 'form-row collapse-toggle'; // CSS hook
|
|
||||||
var collapse_link = document.createElement('a');
|
var collapse_link = document.createElement('a');
|
||||||
collapse_link.setAttribute('href', 'javascript:CollapsedFieldsets.display(' + i + ');');
|
collapse_link.className = 'collapse-toggle';
|
||||||
collapse_link.appendChild(document.createTextNode('Show ' + verbose_name));
|
collapse_link.id = 'fieldsetcollapser' + i;
|
||||||
div.appendChild(collapse_link);
|
collapse_link.onclick = new Function('CollapsedFieldsets.show('+i+'); return false;');
|
||||||
fs.appendChild(div);
|
collapse_link.href = '#';
|
||||||
|
collapse_link.innerHTML = 'Show';
|
||||||
|
var h2 = fs.getElementsByTagName('h2')[0];
|
||||||
|
h2.appendChild(document.createTextNode(' ('));
|
||||||
|
h2.appendChild(collapse_link);
|
||||||
|
h2.appendChild(document.createTextNode(')'));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
if (collapsed_seen) {
|
if (collapsed_seen) {
|
||||||
|
@ -62,18 +53,30 @@ var CollapsedFieldsets = {
|
||||||
}
|
}
|
||||||
return false;
|
return false;
|
||||||
},
|
},
|
||||||
display: function(fieldset_index) {
|
show: function(fieldset_index) {
|
||||||
var fs = document.getElementsByTagName('fieldset')[fieldset_index];
|
var fs = document.getElementsByTagName('fieldset')[fieldset_index];
|
||||||
// Remove the class name that causes the "display: none".
|
// Remove the class name that causes the "display: none".
|
||||||
fs.className = fs.className.replace(CollapsedFieldsets.collapsed_re, '');
|
fs.className = fs.className.replace(CollapsedFieldsets.collapsed_re, '');
|
||||||
// Remove the "Show foo" link.
|
// Toggle the "Show" link to a "Hide" link
|
||||||
fs.removeChild(document.getElementById('fieldsetcollapser' + fieldset_index));
|
var collapse_link = document.getElementById('fieldsetcollapser' + fieldset_index);
|
||||||
|
collapse_link.onclick = new Function('CollapsedFieldsets.hide('+fieldset_index+'); return false;');
|
||||||
|
collapse_link.innerHTML = 'Hide';
|
||||||
},
|
},
|
||||||
|
hide: function(fieldset_index) {
|
||||||
|
var fs = document.getElementsByTagName('fieldset')[fieldset_index];
|
||||||
|
// Add the class name that causes the "display: none".
|
||||||
|
fs.className += ' ' + CollapsedFieldsets.collapsed_class;
|
||||||
|
// Toggle the "Hide" link to a "Show" link
|
||||||
|
var collapse_link = document.getElementById('fieldsetcollapser' + fieldset_index);
|
||||||
|
collapse_link.onclick = new Function('CollapsedFieldsets.show('+fieldset_index+'); return false;');
|
||||||
|
collapse_link.innerHTML = 'Show';
|
||||||
|
},
|
||||||
|
|
||||||
uncollapse_all: function() {
|
uncollapse_all: function() {
|
||||||
var fieldsets = document.getElementsByTagName('fieldset');
|
var fieldsets = document.getElementsByTagName('fieldset');
|
||||||
for (var i=0; i<fieldsets.length; i++) {
|
for (var i=0; i<fieldsets.length; i++) {
|
||||||
if (fieldsets[i].className.match(CollapsedFieldsets.collapsed_re)) {
|
if (fieldsets[i].className.match(CollapsedFieldsets.collapsed_re)) {
|
||||||
CollapsedFieldsets.display(i);
|
CollapsedFieldsets.show(i);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue