Badgeyay: Add error info to specific field and include details

[mariobehling]

When a user enters data that is not correct entered and hits "Upload" a general error message appears. Please make this easier to understand and add more information.

1. Highlight the box that was erroneous in red and add info that it is erroneous
2. Keep the information that was previously entered in all fields
3. Provide a helper text how the information should be correctly formatted

See screenshot above. The user does not know what is the correct format. There is no info anywhere what the correct format is like.

[djmgit]

I would like to work on this :)

[pushkalkatara]

@djmgit are you working on this issue?

[djmgit]

@pushkalkatara Yes I am working on this, was busy last few days, I will submit a PR by this weekend for sure :)

[djmgit]

@jajodiaraghav @S2606 @gabru-md How about doing form validation using javascript in the client side itself rather than in server side. This way displaying error will be more flexible. We just need to add a function for form validation and the entire validation code will remain separate. There will be no need of message passing between server and client via flash. This will also clean up the server side code (main.py) as well as index.html as we can get rid of the flask template syntaxes in many of the places. Also presently when an error is detected, the page is reloaded, and the previous inputs are gone. If we use JS, then previous inputs will remain and also we need not reload the page. What do you guys think? Should I follow this approach ?

[gabru-md]

@djmgit this is really a nice approach and i insist that it must be implemented as it will reduce the load on server side as well ( just like you said ) and the problem of previous lost can also be tackled using this.
Great thoughts @djmgit
I feel you should do it. :+1:
What do you guys say @jajodiaraghav @vaibhavsingh97 @S2606 @mariobehling ? please comment.

[djmgit]

depends on #309