I am using a show/hide JavaScript functionality in an online booking form to show input fields for additional participants on a course (i.e. fields for one participant only at first and then click on Add More Participants to show further fields).
In the code, I have an empty link tag around the words "Add More Participants" but MODx is set up to go to the home page when a user clicks on an ’error’ or ’unauthorised’ page. So as soon as I click on the link it shows me the new form fields for a brief moment before redirecting to the home page.
I am clueless about JavaScript and haven’t used this functionality before. Is there any way around this, either from a JS point of view of by using some sort of MODx override to not redirect for this page??? Thanks!
The code I am using is:
<script language="javascript">
<!-- ////Show/Hide Script ///
var state = 'none';
function showhide(layer_ref) {
if (state == 'block')
{
state = 'none';
}
else
{
state = 'block';
}
if (document.getElementById &&!document.all)
{
hza = document.getElementById(layer_ref);
hza.style.display = state;
}
}
</script>
The HTML bit to show/hide the form fields is:
<p><a href="#" onclick="showhide('participant2');">Click to add another participant</a></p>
<div id="participant2" style="display: none;">
<fieldset>
<legend>PARTICIPANT 2</legend>
<label for="cfFirstName2">FIRST NAME 2:</label>
<input name="firstname2" id="cfFirstName2" class="text" type="text" size="20" maxlength="100" eform="First Name 2::1:" /><br />
etc.
</div>
