I have set error msg for form validation.. but trying to figure out how to remove error msg

Question

Please help me to progress in this tiny app😎
https://code.sololearn.com/WK0XU6f0mp1x/?ref=app

Answer 1

Nice design :)
You may be aware that in code playground you need to wait for document load ends before accessing DOM as it seems you've tried to wrap initialisation part in an onload event handler... but...

The functions defined outside this main handler, doesn't have access to this function scope, and the reference you've defined at start (const title, author, isbn; outside the init function, in global scope) are still initialized with 'undefined' or 'null', as they are assigned before DOM was ready (and targeted elements accessible).

A better and cleanest way would been to wrap your whole code in the main handler (no polute global scope, and private global-like scope -- kind of anonymous namespace), but now that's quickest to fix as is:

Replace global const init by just var declaration:

var title, author, isbn;

... and delete 'const' from these 3 variables initialisation in the init function (no 'var', no 'let': you want to assign the global vars for being accessibke from outside).

That's all folks !

Answer 2

have set error msg for form validation.. but trying to figure out how to remove error msg

Answer 3

I told you at end of my first post after explanation of how and why:

now that's quickest to fix as is:

Replace global const init by just var declaration:

var title, author, isbn;

... and delete 'const' from these 3 variables initialisation in the init function (no 'var', no 'let': you want to assign the global vars for being accessible from outside).

Answer 4

Thanks for explanations 🙏 I fixed that what you said..

But i am sorry mate my question is different.. I have made function to display error msg if you don't fill input fields and try to add book ..

Please try to run my app again..

Answer 5

I don't understand your problem: if you follow completly my advices, your code will work fine, form validation included... (even if your last saved version is not working at all (blank page) if you run it in this intermediate state (you only follow the first part of the 2 things to do -- don't forget the last paragraph ^^)

Answer 6

https://code.sololearn.com/WDGmIOLt5ZuV/?ref=app

Answer 7

Please try to run app now.. press "ADD BOOK" button without filling any inputs.. it will display error msg ("title mus be filled, author must be filled, isbn must be filled " under respective input fields...

Answer 8

Well, that's now working, isn't it?

... Even if time of loading is quite long ;P

But I have found the accountable: remove the font-awesome js script, and you'll got an instant loading :)

Answer 9

... and error msg are displayed as they must ^^

Answer 10

Yeah thanks.. trying to make a function that removes error msg displayed on screen