Question

The code I’m using is supposed to change the ‘action’ attribute for a form based on radio button selection. It doesn’t work at the moment and I’m trying to work out why. According to my Firefox error console, the function ‘submitForm’ is not defined – but I’m sure it is defined!!

Can anyone help?

Code as follows:

Inside the head (q1 refers to the name attribute of the radio buttons):

<script type="text/javascript" src="scripts/javascript.js">
function submitForm() {
 if (document.forms[0].q1[1].checked == true) {
  document.forms[0].action = "q2.html";
  }
 else if (document.forms[0].q1[0].checked == true) {
  document.forms[0].action = "q3.html";
  }
 else {
  alert ('Please choose an option');
 }
}
</script>

And the event handler:

 <form method="post" id="question1" onsubmit="return submitForm();">

Answer 1

You can’t have a cript tag with a src and script contents. Your browser is loading the script file, and ignoring the contents inside, thus your function is undefined. this is what you want:

<script type="text/javascript" src="scripts/javascript.js"></script>
<script type="text/javascript">
    function submitForm() {
     if (document.forms[0].q1[1].checked == true) {
      document.forms[0].action = "q2.html";
      }
     else if (document.forms[0].q1[0].checked == true) {
      document.forms[0].action = "q3.html";
      }
     else {
      alert ('Please choose an option');
     }
    }
</script>