Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.

zlinuk

macrumors regular
Original poster
Jul 8, 2008
111
27
UK
This is hopefully an easy one for those amongst you that are js guru's.

So here is the scenario;

I have a very simple form which contains a couple of text fields and a single button.

When the button is pressed, I want three things to happen;

1 The form data is submitted.
2 The form is reset.
3 A hidden link is "clicked"

So, I created (copied from internet) the following function;

HTML:
<script type="text/javascript">
function submit_form()
 {
	document.form1.submit();
	document.form1.reset();
	document.getElementById("mb2").click();
	}
</script>

The function is called when the button is clicked.

HTML:
<input name="Button" type="button" class="submit1" id="submit1" onclick="submit_form()" value="Submit" />

The situation is that the submit and the reset works fine across the board, the ".click()" works in IE and throws an error in FF.

Can anyone offer a solution please?
 
Thanks for that, it seems that I can only use .click on form elements.

I'm actually trying to activate a lightbox from a hidden <a> tag.

The page can be found here http://www.exac-one.com/Contact/index.html

I accept that what i'm trying to do is a poor implementation, but my knowledge of javascript is virtually zero.
 
Can anyone offer a solution please?

Try:

Code:
<script type="text/javascript">
function submit_form()
 {
	document.form1.submit();
	document.form1.reset();
	document.getElementById("mb2").click();
        [b][color=green]return false;[/color][/b]
	}
</script>

The additional line will prevent the default submit event from firing, which is probably preventing Firefox from completing the call to click().
 
Ah, forgetful me. The real problem is that Firefox does not support calling click() on <a> tags, as angelwatt pointed out above.

But, we can still make invoke your lightbox by calling it directly instead of trying to fake a click. Try this:

Code:
<script type="text/javascript">
var box = new MultiBox('mb', {descClassName: 'multiBoxDesc', useOverlay: true , fixedTop: 118 , showControls: false });
function submit_form() {
    document.form1.submit();
    document.form1.reset();
    box.open(document.getElementById("mb2"));
    return false;
}
</script>

BTW, I also noticed that you're referencing Spry.Widget.ValidationTextarea, but you've forgotten to link to SpryValidationTextarea.js

HTH.
 
you could also change the hidden <a> element to an <input button>..
here is the code which works in safari and firefox

Code:
<html>

<head>
<script type="text/javascript">
function submit_form()
 {
	document.form1.submit();
	document.form1.reset();
	
	document.getElementById("mb2").click();
}

function alertMsg()
{
	alert("Hidden Click Worked");
}
	
</script>
<style type="text/css">
input.hidden{
	display: none;
}
</style>
</head>
<body>
<form name="form1">
<input name="Button" type="button" class="submit1" id="submit1" onclick="submit_form()" value="Submit" />
<input type="button" name="mb2" id="mb2" value="" onclick="alertMsg()" class="hidden"/>
</form>

</body>

</html>
 
Thanks for all your help and suggestions.

I eventually went with this;

HTML:
function submit_form()
 {
	document.form1.submit();
	document.form1.reset();
	if (navigator.appName=="Microsoft Internet Explorer") 
 	document.getElementById("mb2").click();
 	else box.open(document.getElementById("mb2"));
	}

which seems to work ok across the board.
 
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.