css/js: improve form field rendering behaviour
This commit is contained in:
parent
6bd8a492b6
commit
d71585ad59
public
|
@ -105,7 +105,8 @@ form input[type=submit]:first-of-type {
|
||||||
form p.description {
|
form p.description {
|
||||||
padding: 1em 1em;
|
padding: 1em 1em;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
display: none;
|
font-style: italic;
|
||||||
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
input, select, select option, textarea {
|
input, select, select option, textarea {
|
||||||
|
@ -480,8 +481,8 @@ form dt.active label {
|
||||||
|
|
||||||
form dd.active {
|
form dd.active {
|
||||||
p.description {
|
p.description {
|
||||||
display: block;
|
color: inherit;
|
||||||
width: 100%;
|
font-style: normal;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -95,6 +95,7 @@
|
||||||
{
|
{
|
||||||
var $input = $(ev.currentTarget);
|
var $input = $(ev.currentTarget);
|
||||||
var $dd = $input.closest('dd');
|
var $dd = $input.closest('dd');
|
||||||
|
$dd.find('p.description').show();
|
||||||
if ($dd.attr('id') && $dd.attr('id').match(/button/)) {
|
if ($dd.attr('id') && $dd.attr('id').match(/button/)) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
@ -105,6 +106,19 @@
|
||||||
$li.addClass('active');
|
$li.addClass('active');
|
||||||
$dt.addClass('active');
|
$dt.addClass('active');
|
||||||
$dd.addClass('active');
|
$dd.addClass('active');
|
||||||
|
$dd.find('p.description.fading-out')
|
||||||
|
.stop(true)
|
||||||
|
.removeClass('fading-out')
|
||||||
|
.fadeIn('fast');
|
||||||
|
|
||||||
|
$form.find('dd').not($dd)
|
||||||
|
.find('p.description')
|
||||||
|
.not('.fading-out')
|
||||||
|
.addClass('fading-out')
|
||||||
|
.delay(2000)
|
||||||
|
.fadeOut('slow', function() {
|
||||||
|
$(this).removeClass('fading-out').hide()
|
||||||
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
highlightFormErrors: function($container)
|
highlightFormErrors: function($container)
|
||||||
|
@ -127,12 +141,17 @@
|
||||||
this.openedFieldsets[$fieldset.attr('id')] = ! $fieldset.hasClass('collapsed');
|
this.openedFieldsets[$fieldset.attr('id')] = ! $fieldset.hasClass('collapsed');
|
||||||
},
|
},
|
||||||
|
|
||||||
|
hideInactiveFormDescriptions: function($container) {
|
||||||
|
$container.find('dd').not('.active').find('p.description').hide();
|
||||||
|
},
|
||||||
|
|
||||||
rendered: function(ev) {
|
rendered: function(ev) {
|
||||||
var $container = $(ev.currentTarget);
|
var $container = $(ev.currentTarget);
|
||||||
this.restoreContainerFieldsets($container);
|
this.restoreContainerFieldsets($container);
|
||||||
this.backupAllExtensibleSetDefaultValues($container);
|
this.backupAllExtensibleSetDefaultValues($container);
|
||||||
this.putFocusOnFirstObjectTypeElement($container);
|
this.putFocusOnFirstObjectTypeElement($container);
|
||||||
this.highlightFormErrors($container);
|
this.highlightFormErrors($container);
|
||||||
|
this.hideInactiveFormDescriptions($container);
|
||||||
},
|
},
|
||||||
|
|
||||||
restoreContainerFieldsets: function($container)
|
restoreContainerFieldsets: function($container)
|
||||||
|
|
Loading…
Reference in New Issue