button wont submit script

Question

I'm currently trying to make a script for educational purposes. Now I want to check the answers people give by using a little script. But I think everything is well-programmed, however it won't submit. Any ideas?

 <div>
 Ik<input id="invulvraag1" type="text" placeholder="h..."> Marie.
 <button onclick="myFunction()">Controleer</button>
 <p id="demo"></p>
 </div>
 <script>
 function myFunction() {
 var text = document.getElementById("invulvraag1").value;
 var text;
 // Het antwoord is correct
 if (text === "heet") {
 text = "perfect, goedzo!";
 // het antwoord is iets anders
 } else {
 text = "helaas.. het had "heet" moeten zijn.";
 }
 document.getElementById("demo").innerHTML = text;
 }
 </script>

• Mahi: where you want to submit form ?? its a part of server side
• Shubham: In else condition quotes are causing problem. Use "helaas.. het had 'heet' moeten zijn."; or "helaas.. het had \"heet\" moeten zijn.";
• Pekka: Anything in the error console?
• T.J. Crowder: @Pekka웃: Yes, there is. ;-)
• dick doeven: @Mahi im sorry, the button is used for submitting the form, i made it in dutch ;)

Answer 1

For frontend programming you will need to use console (dev tools). Press F12 or right click inspect element for safari.

In console tab you will see : js error :

SyntaxError: Unexpected identifier 'heet'

Fix : This line :

 text = "helaas.. het had "heet" moeten zijn.";

must be :

text = "helaas.. het had 'heet' moeten zijn.";

OR

 text = 'helaas.. het had "heet" moeten zijn.';

• dick doeven: maybe another question for you. im going to want to use a diffrent script for every answer, is it possible to have this in an other document so it gets it scripts from there?
• Nikola Lukic: Please , create question with all details is best variant ...Its hard to understand question in one line from comment.

Answer 2

 <div>
 <input id="invulvraag1" type="text" placeholder="h...">
 <button onclick="myFunction()">Controller</button>
 <p id="demo"></p>
 </div>
 <script>
 function myFunction() {
 var text = document.getElementById("invulvraag1").value;
 var text;
 // Het antwoord is correct
 if (text === "heet") {
 text = "perfect, goedzo!";
 document.getElementById("demo").innerHTML = text;
 // het antwoord is iets anders
 } else {
 text = "helaas.. het had "heet" moeten zijn.";
 document.getElementById("demo").innerHTML = text;
 }
 }
 </script>
 use above code it is useful

• Shubham: This Script will throw script error because of text = "helaas.. het had "heet" moeten zijn."; . It will say heet is not defined.

Answer 3

If you want to post the form data on the server by using <form> action method then create button as

<input type="submit" onclick="return myFunction();">
 <script>
 function myFunction() {
 var text = document.getElementById("invulvraag1").value;
 var text;
 // Het antwoord is correct
 if (text === "heet") {
 text = "perfect, goedzo!";
 // het antwoord is iets anders
 } else {
 text = "helaas.. het had "heet" moeten zijn.";
 }
 document.getElementById("demo").innerHTML = text;
 return true;
 }
 </script>

Or if you just want to call the client side function then run the code and click f12 in browser if there will be any error then it will throw in console