MDL-49783 forms: Collapsed form section is opened on error
This commit is contained in:
@@ -81,6 +81,9 @@ Y.extend(SHORTFORMS, Y.Base, {
|
||||
form.delegate('click', this.switch_state, SELECTORS.FIELDSETLEGENDLINK, this);
|
||||
form.delegate('key', this.switch_state, 'down:enter,32', SELECTORS.FIELDSETLEGENDLINK, this);
|
||||
|
||||
// Handle event, when there's an error in collapsed section.
|
||||
Y.Global.on(M.core.globalEvents.FORM_ERROR, this.expand_fieldset, this);
|
||||
|
||||
// Make the collapse/expand a link.
|
||||
btn = form.one(SELECTORS.COLLAPSEEXPAND);
|
||||
if (btn) {
|
||||
@@ -232,7 +235,24 @@ Y.extend(SHORTFORMS, Y.Base, {
|
||||
}
|
||||
|
||||
return this;
|
||||
}
|
||||
},
|
||||
/**
|
||||
* Expand the fieldset, which contains an error.
|
||||
*
|
||||
* @method expand_fieldset
|
||||
* @param {EventFacade} e
|
||||
*/
|
||||
expand_fieldset: function(e) {
|
||||
e.stopPropagation();
|
||||
var formid = e.formid;
|
||||
if (formid === this.form.getAttribute('id')) {
|
||||
var errorfieldset = Y.one('#' + e.elementid).ancestor('fieldset');
|
||||
if (errorfieldset) {
|
||||
this.set_state(errorfieldset, false);
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}, {
|
||||
NAME: 'moodle-form-shortforms',
|
||||
ATTRS: ATTRS
|
||||
@@ -244,4 +264,4 @@ M.form.shortforms = M.form.shortforms || function(params) {
|
||||
};
|
||||
|
||||
|
||||
}, '@VERSION@', {"requires": ["node", "base", "selector-css3"]});
|
||||
}, '@VERSION@', {"requires": ["node", "base", "selector-css3", "moodle-core-event"]});
|
||||
|
||||
@@ -1 +1 @@
|
||||
YUI.add("moodle-form-shortforms",function(e,t){function n(){n.superclass.constructor.apply(this,arguments)}var r={COLLAPSEEXPAND:".collapsible-actions .collapseexpand",COLLAPSED:".collapsed",FIELDSETCOLLAPSIBLE:"fieldset.collapsible",FIELDSETLEGENDLINK:"fieldset.collapsible .fheader",FHEADER:".fheader",LEGENDFTOGGLER:"legend.ftoggler"},i={COLLAPSEALL:"collapse-all",COLLAPSED:"collapsed",FHEADER:"fheader"},s={};s.formid={value:null},e.extend(n,e.Base,{form:null,initializer:function(){var t=e.one("#"+this.get("formid")),n,i,s,o;if(!t)return;this.form=t,n=t.all(r.FIELDSETCOLLAPSIBLE),n.each(this.process_fieldset,this),t.delegate("click",this.switch_state,r.FIELDSETLEGENDLINK,this),t.delegate("key",this.switch_state,"down:enter,32",r.FIELDSETLEGENDLINK,this),i=t.one(r.COLLAPSEEXPAND),i&&(s=e.Node.create('<a href="#"></a>'),s.setHTML(i.getHTML()),s.setAttribute("class",i.getAttribute("class")),s.setAttribute("role","button"),o=[],t.all(r.FIELDSETLEGENDLINK).each(function(e){o[o.length]=e.generateID()}),s.setAttribute("aria-controls",o.join(" ")),s.on("click",this.set_state_all,this,!0),s.on("key",this.set_state_all,"down:enter,32",this,!0),i.replace(s),this.update_btns(t))},process_fieldset:function(t){var n=t.one(r.LEGENDFTOGGLER),s=e.Node.create('<a href="#"></a>');return s.addClass(i.FHEADER),s.appendChild(n.get("firstChild")),s.setAttribute("role","button"),s.setAttribute("aria-controls",t.generateID()),n.ancestor(r.COLLAPSED)?s.setAttribute("aria-expanded","false"):s.setAttribute("aria-expanded","true"),n.prepend(s),this},set_state:function(e,t){headerlink=e.one(r.FHEADER),t?(e.addClass(i.COLLAPSED),headerlink&&headerlink.setAttribute("aria-expanded","false")):(e.removeClass(i.COLLAPSED),headerlink&&headerlink.setAttribute("aria-expanded","true"));var n=this.form.one("input[name=mform_isexpanded_"+e.get("id")+"]");return n?(n.set("value",t?0:1),this):this},set_state_all:function(e){e.preventDefault();var t=e.target.hasClass(i.COLLAPSEALL),n=this.form.all(r.FIELDSETCOLLAPSIBLE);n.each(function(e){this.set_state(e,t)},this),this.update_btns()},switch_state:function(e){e.preventDefault();var t=e.target.ancestor(r.FIELDSETCOLLAPSIBLE);this.set_state(t,!t.hasClass(i.COLLAPSED)),this.update_btns()},update_btns:function(){var e,t=0,n=!1,s;return e=this.form.one(r.COLLAPSEEXPAND),e?(s=this.form.all(r.FIELDSETCOLLAPSIBLE),s.each(function(e){e.hasClass(i.COLLAPSED)&&t++}),t!==0&&(n=!0),n?(e.removeClass(i.COLLAPSEALL),e.setHTML(M.util.get_string("expandall","moodle"))):(e.addClass(i.COLLAPSEALL),e.setHTML(M.util.get_string("collapseall","moodle"))),this):this}},{NAME:"moodle-form-shortforms",ATTRS:s}),M.form=M.form||{},M.form.shortforms=M.form.shortforms||function(e){return new n(e)}},"@VERSION@",{requires:["node","base","selector-css3"]});
|
||||
YUI.add("moodle-form-shortforms",function(e,t){function n(){n.superclass.constructor.apply(this,arguments)}var r={COLLAPSEEXPAND:".collapsible-actions .collapseexpand",COLLAPSED:".collapsed",FIELDSETCOLLAPSIBLE:"fieldset.collapsible",FIELDSETLEGENDLINK:"fieldset.collapsible .fheader",FHEADER:".fheader",LEGENDFTOGGLER:"legend.ftoggler"},i={COLLAPSEALL:"collapse-all",COLLAPSED:"collapsed",FHEADER:"fheader"},s={};s.formid={value:null},e.extend(n,e.Base,{form:null,initializer:function(){var t=e.one("#"+this.get("formid")),n,i,s,o;if(!t)return;this.form=t,n=t.all(r.FIELDSETCOLLAPSIBLE),n.each(this.process_fieldset,this),t.delegate("click",this.switch_state,r.FIELDSETLEGENDLINK,this),t.delegate("key",this.switch_state,"down:enter,32",r.FIELDSETLEGENDLINK,this),e.Global.on(M.core.globalEvents.FORM_ERROR,this.expand_fieldset,this),i=t.one(r.COLLAPSEEXPAND),i&&(s=e.Node.create('<a href="#"></a>'),s.setHTML(i.getHTML()),s.setAttribute("class",i.getAttribute("class")),s.setAttribute("role","button"),o=[],t.all(r.FIELDSETLEGENDLINK).each(function(e){o[o.length]=e.generateID()}),s.setAttribute("aria-controls",o.join(" ")),s.on("click",this.set_state_all,this,!0),s.on("key",this.set_state_all,"down:enter,32",this,!0),i.replace(s),this.update_btns(t))},process_fieldset:function(t){var n=t.one(r.LEGENDFTOGGLER),s=e.Node.create('<a href="#"></a>');return s.addClass(i.FHEADER),s.appendChild(n.get("firstChild")),s.setAttribute("role","button"),s.setAttribute("aria-controls",t.generateID()),n.ancestor(r.COLLAPSED)?s.setAttribute("aria-expanded","false"):s.setAttribute("aria-expanded","true"),n.prepend(s),this},set_state:function(e,t){headerlink=e.one(r.FHEADER),t?(e.addClass(i.COLLAPSED),headerlink&&headerlink.setAttribute("aria-expanded","false")):(e.removeClass(i.COLLAPSED),headerlink&&headerlink.setAttribute("aria-expanded","true"));var n=this.form.one("input[name=mform_isexpanded_"+e.get("id")+"]");return n?(n.set("value",t?0:1),this):this},set_state_all:function(e){e.preventDefault();var t=e.target.hasClass(i.COLLAPSEALL),n=this.form.all(r.FIELDSETCOLLAPSIBLE);n.each(function(e){this.set_state(e,t)},this),this.update_btns()},switch_state:function(e){e.preventDefault();var t=e.target.ancestor(r.FIELDSETCOLLAPSIBLE);this.set_state(t,!t.hasClass(i.COLLAPSED)),this.update_btns()},update_btns:function(){var e,t=0,n=!1,s;return e=this.form.one(r.COLLAPSEEXPAND),e?(s=this.form.all(r.FIELDSETCOLLAPSIBLE),s.each(function(e){e.hasClass(i.COLLAPSED)&&t++}),t!==0&&(n=!0),n?(e.removeClass(i.COLLAPSEALL),e.setHTML(M.util.get_string("expandall","moodle"))):(e.addClass(i.COLLAPSEALL),e.setHTML(M.util.get_string("collapseall","moodle"))),this):this},expand_fieldset:function(t){t.stopPropagation();var n=t.formid;if(n===this.form.getAttribute("id")){var r=e.one("#"+t.elementid).ancestor("fieldset");r&&this.set_state(r,!1)}}},{NAME:"moodle-form-shortforms",ATTRS:s}),M.form=M.form||{},M.form.shortforms=M.form.shortforms||function(e){return new n(e)}},"@VERSION@",{requires:["node","base","selector-css3","moodle-core-event"]});
|
||||
|
||||
@@ -80,6 +80,9 @@ Y.extend(SHORTFORMS, Y.Base, {
|
||||
form.delegate('click', this.switch_state, SELECTORS.FIELDSETLEGENDLINK, this);
|
||||
form.delegate('key', this.switch_state, 'down:enter,32', SELECTORS.FIELDSETLEGENDLINK, this);
|
||||
|
||||
// Handle event, when there's an error in collapsed section.
|
||||
Y.Global.on(M.core.globalEvents.FORM_ERROR, this.expand_fieldset, this);
|
||||
|
||||
// Make the collapse/expand a link.
|
||||
btn = form.one(SELECTORS.COLLAPSEEXPAND);
|
||||
if (btn) {
|
||||
@@ -229,7 +232,24 @@ Y.extend(SHORTFORMS, Y.Base, {
|
||||
}
|
||||
|
||||
return this;
|
||||
}
|
||||
},
|
||||
/**
|
||||
* Expand the fieldset, which contains an error.
|
||||
*
|
||||
* @method expand_fieldset
|
||||
* @param {EventFacade} e
|
||||
*/
|
||||
expand_fieldset: function(e) {
|
||||
e.stopPropagation();
|
||||
var formid = e.formid;
|
||||
if (formid === this.form.getAttribute('id')) {
|
||||
var errorfieldset = Y.one('#' + e.elementid).ancestor('fieldset');
|
||||
if (errorfieldset) {
|
||||
this.set_state(errorfieldset, false);
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}, {
|
||||
NAME: 'moodle-form-shortforms',
|
||||
ATTRS: ATTRS
|
||||
@@ -241,4 +261,4 @@ M.form.shortforms = M.form.shortforms || function(params) {
|
||||
};
|
||||
|
||||
|
||||
}, '@VERSION@', {"requires": ["node", "base", "selector-css3"]});
|
||||
}, '@VERSION@', {"requires": ["node", "base", "selector-css3", "moodle-core-event"]});
|
||||
|
||||
+21
-1
@@ -79,6 +79,9 @@ Y.extend(SHORTFORMS, Y.Base, {
|
||||
form.delegate('click', this.switch_state, SELECTORS.FIELDSETLEGENDLINK, this);
|
||||
form.delegate('key', this.switch_state, 'down:enter,32', SELECTORS.FIELDSETLEGENDLINK, this);
|
||||
|
||||
// Handle event, when there's an error in collapsed section.
|
||||
Y.Global.on(M.core.globalEvents.FORM_ERROR, this.expand_fieldset, this);
|
||||
|
||||
// Make the collapse/expand a link.
|
||||
btn = form.one(SELECTORS.COLLAPSEEXPAND);
|
||||
if (btn) {
|
||||
@@ -230,7 +233,24 @@ Y.extend(SHORTFORMS, Y.Base, {
|
||||
}
|
||||
|
||||
return this;
|
||||
}
|
||||
},
|
||||
/**
|
||||
* Expand the fieldset, which contains an error.
|
||||
*
|
||||
* @method expand_fieldset
|
||||
* @param {EventFacade} e
|
||||
*/
|
||||
expand_fieldset: function(e) {
|
||||
e.stopPropagation();
|
||||
var formid = e.formid;
|
||||
if (formid === this.form.getAttribute('id')) {
|
||||
var errorfieldset = Y.one('#' + e.elementid).ancestor('fieldset');
|
||||
if (errorfieldset) {
|
||||
this.set_state(errorfieldset, false);
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}, {
|
||||
NAME: 'moodle-form-shortforms',
|
||||
ATTRS: ATTRS
|
||||
|
||||
@@ -3,7 +3,8 @@
|
||||
"requires": [
|
||||
"node",
|
||||
"base",
|
||||
"selector-css3"
|
||||
"selector-css3",
|
||||
"moodle-core-event"
|
||||
]
|
||||
}
|
||||
}
|
||||
|
||||
@@ -2229,6 +2229,8 @@ function validate_' . $this->_formName . '_' . $escapedElementName . '(element)
|
||||
ret = validate_' . $this->_formName . '_' . $escapedElementName.'(frm.elements[\''.$elementName.'\']) && ret;
|
||||
if (!ret && !first_focus) {
|
||||
first_focus = true;
|
||||
Y.Global.fire(M.core.globalEvents.FORM_ERROR, {formid: \''. $this->_attributes['id'] .'\',
|
||||
elementid: \'id_error_'.$elementName.'\'});
|
||||
document.getElementById(\'id_error_'.$elementName.'\').focus();
|
||||
}
|
||||
';
|
||||
|
||||
+19
-1
@@ -44,6 +44,17 @@ M.core.event = {
|
||||
FILTER_CONTENT_UPDATED: "filter-content-updated"
|
||||
};
|
||||
|
||||
M.core.globalEvents = {
|
||||
/**
|
||||
* This event is triggered when form has an error
|
||||
*
|
||||
* @event "form_error"
|
||||
* @param formid {string} Id of form with error.
|
||||
* @param elementid {string} Id of element with error.
|
||||
*/
|
||||
FORM_ERROR: "form_error"
|
||||
};
|
||||
|
||||
|
||||
var eventDefaultConfig = {
|
||||
emitFacade: true,
|
||||
@@ -58,6 +69,8 @@ var eventDefaultConfig = {
|
||||
}
|
||||
};
|
||||
|
||||
// Publish events with a custom config here.
|
||||
|
||||
// Publish all the events with a standard config.
|
||||
var key;
|
||||
for (key in M.core.event) {
|
||||
@@ -66,7 +79,12 @@ for (key in M.core.event) {
|
||||
}
|
||||
}
|
||||
|
||||
// Publish events with a custom config here.
|
||||
//Publish all the global events.
|
||||
for (key in M.core.globalEvents) {
|
||||
if (M.core.globalEvents.hasOwnProperty(key)) {
|
||||
Y.Global.publish(M.core.globalEvents[key], Y.merge(eventDefaultConfig, {broadcast: 2}));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}, '@VERSION@', {"requires": ["event-custom"]});
|
||||
|
||||
@@ -1 +1 @@
|
||||
YUI.add("moodle-core-event",function(e,t){var n="moodle-core-event";M.core=M.core||{},M.core.event={FILTER_CONTENT_UPDATED:"filter-content-updated"};var r={emitFacade:!0,defaultFn:function(e){},preventedFn:function(e){},stoppedFn:function(e){}},i;for(i in M.core.event)M.core.event.hasOwnProperty(i)&&e.publish(M.core.event[i],r)},"@VERSION@",{requires:["event-custom"]});
|
||||
YUI.add("moodle-core-event",function(e,t){var n="moodle-core-event";M.core=M.core||{},M.core.event={FILTER_CONTENT_UPDATED:"filter-content-updated"},M.core.globalEvents={FORM_ERROR:"form_error"};var r={emitFacade:!0,defaultFn:function(e){},preventedFn:function(e){},stoppedFn:function(e){}},i;for(i in M.core.event)M.core.event.hasOwnProperty(i)&&e.publish(M.core.event[i],r);for(i in M.core.globalEvents)M.core.globalEvents.hasOwnProperty(i)&&e.Global.publish(M.core.globalEvents[i],e.merge(r,{broadcast:2}))},"@VERSION@",{requires:["event-custom"]});
|
||||
|
||||
+19
-1
@@ -44,6 +44,17 @@ M.core.event = {
|
||||
FILTER_CONTENT_UPDATED: "filter-content-updated"
|
||||
};
|
||||
|
||||
M.core.globalEvents = {
|
||||
/**
|
||||
* This event is triggered when form has an error
|
||||
*
|
||||
* @event "form_error"
|
||||
* @param formid {string} Id of form with error.
|
||||
* @param elementid {string} Id of element with error.
|
||||
*/
|
||||
FORM_ERROR: "form_error"
|
||||
};
|
||||
|
||||
|
||||
var eventDefaultConfig = {
|
||||
emitFacade: true,
|
||||
@@ -55,6 +66,8 @@ var eventDefaultConfig = {
|
||||
}
|
||||
};
|
||||
|
||||
// Publish events with a custom config here.
|
||||
|
||||
// Publish all the events with a standard config.
|
||||
var key;
|
||||
for (key in M.core.event) {
|
||||
@@ -63,7 +76,12 @@ for (key in M.core.event) {
|
||||
}
|
||||
}
|
||||
|
||||
// Publish events with a custom config here.
|
||||
//Publish all the global events.
|
||||
for (key in M.core.globalEvents) {
|
||||
if (M.core.globalEvents.hasOwnProperty(key)) {
|
||||
Y.Global.publish(M.core.globalEvents[key], Y.merge(eventDefaultConfig, {broadcast: 2}));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}, '@VERSION@', {"requires": ["event-custom"]});
|
||||
|
||||
Vendored
+19
-1
@@ -42,6 +42,17 @@ M.core.event = {
|
||||
FILTER_CONTENT_UPDATED: "filter-content-updated"
|
||||
};
|
||||
|
||||
M.core.globalEvents = {
|
||||
/**
|
||||
* This event is triggered when form has an error
|
||||
*
|
||||
* @event "form_error"
|
||||
* @param formid {string} Id of form with error.
|
||||
* @param elementid {string} Id of element with error.
|
||||
*/
|
||||
FORM_ERROR: "form_error"
|
||||
};
|
||||
|
||||
|
||||
var eventDefaultConfig = {
|
||||
emitFacade: true,
|
||||
@@ -56,6 +67,8 @@ var eventDefaultConfig = {
|
||||
}
|
||||
};
|
||||
|
||||
// Publish events with a custom config here.
|
||||
|
||||
// Publish all the events with a standard config.
|
||||
var key;
|
||||
for (key in M.core.event) {
|
||||
@@ -64,4 +77,9 @@ for (key in M.core.event) {
|
||||
}
|
||||
}
|
||||
|
||||
// Publish events with a custom config here.
|
||||
//Publish all the global events.
|
||||
for (key in M.core.globalEvents) {
|
||||
if (M.core.globalEvents.hasOwnProperty(key)) {
|
||||
Y.Global.publish(M.core.globalEvents[key], Y.merge(eventDefaultConfig, {broadcast: 2}));
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user