Page MenuHomePhabricator

Validation of hidden fields keep form from validating during submit
Closed, ResolvedPublic

Description

Author: alj62888

Description:
Testing for an upgrade from SemanticBundle 1.8alpha to:

Semantic Bundle (Version 1.8.0.5)
Semantic Forms (Version 2.5.3)
Semantic Forms Inputs (Version 0.7)
Semantic MediaWiki (Version 1.8.0.5)

I have a mandatory field using regex validation, but it is hidden because the value of a dropdown is not selected. But, validation still fails during submit. The main validation error message appears at the top of the form, but the specific error can't be seen next to it's field because it is in the hidden div.

Workaround: Removing the mandatory option and removing the regex rule allows the form to be submitted.

I'm trying to upgrade to 1.8.0.5 to get the fix for this very bug... didn't see a bug on it but I looked at the code changes and looked like it was addressed.


Version: REL1_20-branch
Severity: normal
OS: Linux

Details

Reference
bz58077

Event Timeline

bzimport raised the priority of this task from to Needs Triage.Nov 22 2014, 2:24 AM
bzimport set Reference to bz58077.

What do you mean by "using regex validation"? What does the {{{field}}} tag look like?

alj62888 wrote:

NOTE: when I say 'hidden', I'm not referring to the hidden option for fields. I'm speaking about a div that is hidden unless a dropdown value matches one of the "show on select" options.

alj62888 wrote:

{{{field|additional-url-vid-startsec|input type=regexp|regexp=/^\d{1,2}$/ |maxlength=2|size=1|mandatory}}}

Right, I got the "hidden" part. Is the "mandatory" part necessary, given the regexp validation? Maybe it's the interplay of those two that's causing this bug... at least, that's my hope.

alj62888 wrote:

I just tried both combinations... without mandatory and without the regex. Both have to be removed.

alj62888 wrote:

I think I found a fix:

[root@ip-10-0-1-101 libs]# diff SemanticForms.js.ori SemanticForms.js
771c771,772

< jQuery("#" + sfdata.validationFunctions[i].input).closest(".multipleTemplateStarter").length == 0 ) {

jQuery("#" + sfdata.validationFunctions[i].input).closest(".multipleTemplateStarter").length == 0 &&
jQuery("#" + sfdata.validationFunctions[i].input).closest(".hiddenBySF").length == 0) {

alj62888 wrote:

The fix above is not enough since the hidden stuff may not have had the hiddenBySF class added to them upon page load and it looks like mandatory but hidden fields are setup to be validated. Is that by design?

So, this fix might not be valid:

[root@ip-10-0-1-101 libs]# diff SemanticForms.js.ori SemanticForms.js
733c733

< jQuery("span.inputSpan.mandatoryFieldSpan").not(".hiddenBySF").each( function() {

jQuery("span.inputSpan.mandatoryFieldSpan").not(".hiddenBySF").not(":hidden").each( function() {

771c771,774

< jQuery("#" + sfdata.validationFunctions[i].input).closest(".multipleTemplateStarter").length == 0 ) {

jQuery("#" + sfdata.validationFunctions[i].input).closest(".multipleTemplateStarter").length == 0 &&
// My Change: fix for bug https://bugzilla.wikimedia.org/show_bug.cgi?id=58077
jQuery("#" + sfdata.validationFunctions[i].input).closest(".hiddenBySF").length == 0 &&
jQuery("#" + sfdata.validationFunctions[i].input + ":hidden").length == 0) {

alj62888 wrote:

Well, there was another problem with fields with default values and within disabled divs (hidden) still being submitted, so I had to add one more check. Also, added the .parent() call to make sure that SF-hidden (but visible) fields DO get submitted.

diff SemanticForms.js.ori SemanticForms.js

733c733

< jQuery("span.inputSpan.mandatoryFieldSpan").not(".hiddenBySF").each( function() {

jQuery("span.inputSpan.mandatoryFieldSpan").not(".hiddenBySF").not(":hidden").each( function() {

771c771,774

< jQuery("#" + sfdata.validationFunctions[i].input).closest(".multipleTemplateStarter").length == 0 ) {

jQuery("#" + sfdata.validationFunctions[i].input).closest(".multipleTemplateStarter").length == 0 &&
// My Change: fix for bug https://bugzilla.wikimedia.org/show_bug.cgi?id=58077
jQuery("#" + sfdata.validationFunctions[i].input).closest(".hiddenBySF").length == 0 &&
jQuery("#" + sfdata.validationFunctions[i].input).parent().closest(":hidden").length == 0) {

776c779

< )

) {

777a781

}

795a800,809

// My Change, like above for bug 58077
jQuery("input, select, textarea").each(function() {
        if(jQuery(this).parent().closest(":hidden").length != 0) {
                jQuery(this).attr('disabled', 'disabled')
                .addClass('disabledBySF')
                .addClass('hiddenBySF');
        }
});

Does this fully work, as far as you know?

alj62888 wrote:

Seems to, but I'm no expert.

Change 104514 had a related patch set uploaded by Yaron Koren:
Fix to avoid JS validation of fields hidden by "show on select"

https://gerrit.wikimedia.org/r/104514

Change 104514 merged by jenkins-bot:
Fix to avoid JS validation of fields hidden by "show on select"

https://gerrit.wikimedia.org/r/104514

Hi Al,

I looked into this - I definitely was able to replicate the problem with the "regexp" input type; but "mandatory" worked fine for me, without the need for changes. Your first fix (the two-line change) fixed the problem for me, for both regular and multiple-instance templates, so I checked it in. Could you please get the latest code and see if you're still having any problems?

I believe this is fixed, so I'm marking it as "fixed" - feel free to re-open.