Bug 27668

Summary: Improve validation of patron entry form in the OPAC
Product: Koha Reporter: Katrin Fischer <katrin.fischer>
Component: TemplatesAssignee: Owen Leonard <oleonard>
Status: CLOSED FIXED QA Contact: Testopia <testopia>
Severity: normal    
Priority: P5 - low CC: fridolin.somers, martin.renvoize
Version: master   
Hardware: All   
OS: All   
Change sponsored?: --- Patch complexity: Small patch
Documentation contact: Documentation submission:
Text to go in the release notes:
Version(s) released in:
21.05.00
Bug Depends on:    
Bug Blocks: 27681    
Attachments: Bug 27668: Improve validation of patron entry form in the OPAC
Bug 27668: Improve validation of patron entry form in the OPAC
Bug 27668: Improve validation of patron entry form in the OPAC

Description Katrin Fischer 2021-02-10 09:21:35 UTC
When a user self registers at the OPAC and doesn't fill out the captcha, and error message is displaysed: "This field is required." 
This string doesn't appear in the po files for the OPAC. I the intanet it appears in validator-strings.inc, but there doesn't appear to be a corresponding file for the OPAC. Could this be the reason for the translation issue?
Comment 1 Owen Leonard 2021-02-10 20:00:06 UTC
I've retitled this bug to accommodate the expanded scope of the work I ended up doing. Besides simply adding the missing validator strings include file I'm restructuring the template logic around mandatory fields to try to make it more efficient and easier to read.
Comment 2 Owen Leonard 2021-02-10 20:30:41 UTC Comment hidden (obsolete)
Comment 3 Katrin Fischer 2021-03-04 12:58:00 UTC
Created attachment 117716 [details] [review]
Bug 27668: Improve validation of patron entry form in the OPAC

This patch improves the way we handle required fields in the patron
entry/update form in the OPAC. Instead of doing multiple checks for each
field using mandatory.defined(), the template now loops over a list of
fields and sets a "required" variable for any which are required.

Then, for each form field, the "required" variable is used to set
classes on labels, input fields, and the "required" text hints. The
class on form fields acts as a hook for the jQuery validator plugin. The
class on the text hints allows us to hide the text hint using CSS,
eliminating the necessity of using a template conditional.

The patch also adds the missing validator-strings include which enables
translation of the jQuery validator plugin's validation error messages.

To test, apply the patch and rebuild the OPAC CSS
(https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client).

 - Go to Administration -> System preferences and enable
   PatronSelfRegistration.
 - Select multiple fields to be required using the
   PatronSelfRegistrationBorrowerMandatoryField preference.
 - In the OPAC, start the process of registering for an account.
 - The fields you designated as mandatory should each have a "Required"
   label under them.
 - Try to submit the form without entering any data. The required fields
   should now be highlighted in red and have another label, "This field
   is  required."
 - Fill in the required fields and submit the form. It should submit
   correctly.
 - Modify the PatronSelfRegistrationBorrowerMandatoryField preference
   and select all fields as mandatory. Confirm that all fields in the
   patron entry form work correctly.
 - Test that form validation works correctly when modifying a logged-in
   patron's existing account.

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>

https://bugs.koha-community.org/show_bug.cgi?id=27688
Comment 4 Martin Renvoize 2021-03-05 10:21:06 UTC
Created attachment 117799 [details] [review]
Bug 27668: Improve validation of patron entry form in the OPAC

This patch improves the way we handle required fields in the patron
entry/update form in the OPAC. Instead of doing multiple checks for each
field using mandatory.defined(), the template now loops over a list of
fields and sets a "required" variable for any which are required.

Then, for each form field, the "required" variable is used to set
classes on labels, input fields, and the "required" text hints. The
class on form fields acts as a hook for the jQuery validator plugin. The
class on the text hints allows us to hide the text hint using CSS,
eliminating the necessity of using a template conditional.

The patch also adds the missing validator-strings include which enables
translation of the jQuery validator plugin's validation error messages.

To test, apply the patch and rebuild the OPAC CSS
(https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client).

 - Go to Administration -> System preferences and enable
   PatronSelfRegistration.
 - Select multiple fields to be required using the
   PatronSelfRegistrationBorrowerMandatoryField preference.
 - In the OPAC, start the process of registering for an account.
 - The fields you designated as mandatory should each have a "Required"
   label under them.
 - Try to submit the form without entering any data. The required fields
   should now be highlighted in red and have another label, "This field
   is  required."
 - Fill in the required fields and submit the form. It should submit
   correctly.
 - Modify the PatronSelfRegistrationBorrowerMandatoryField preference
   and select all fields as mandatory. Confirm that all fields in the
   patron entry form work correctly.
 - Test that form validation works correctly when modifying a logged-in
   patron's existing account.

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Comment 5 Martin Renvoize 2021-03-05 10:21:30 UTC
Works well, and is a general improvement.

Passing QA
Comment 6 Jonathan Druart 2021-03-05 12:51:53 UTC
Pushed to master for 21.05, thanks to everybody involved!
Comment 7 Fridolin Somers 2021-03-08 15:57:39 UTC
Nice.

But lot of changes. This is more en enhancement no ?
Since it is for OPAC :
Is it safe for backport on 20.11.x ?