Forum Moderators: open
function resetForm() {
document.form1.reset()
}
function submitForm() {
document.form1.submit();
}
And, for the HTML
<a href="javascript:submitForm()"> IMAGE HERE </a>
I now have several forms on a page which are each built using hidden elements takenfrom a database. PHP builds each form and each form needs a seperate name and submission button.
How can I use multiple forms? I'm guessing I just need to pass a variable to the javascript but I don't know how.
Could anyone help and stop me feeling like a proper wally?
Thanks,
Chris J
How can I use multiple forms? I'm guessing I just need to pass a variable to the javascript but I don't know how.
Chris, you do need to pass the form ID reference to the javascript function you wish to call.
Take a look at this sample code:
function getElement(elem)
{
// test which method is supported by the browser
if(document.getElementById)
return getElementById(elem);
else if(document.all)
return document.all[elem];
return null;
}function resetForm(formID)
{
// does the form exist?
if((elem = getElement(formID))!= null)
{
// it does exist,
// do whatever you want with the element here (in this case, the form)
elem.reset();
}
}function submitForm(formID)
{
// does the form exist?
if((elem = getElement(formID))!= null)
{
// it does exist,
// do whatever you want with the element here (in this case, the form)
elem.submit();
}
}in the HTML, when calling the functions, always pass the ID of the form enclosed in '_____' to the javascript function you wish to call,
<a href="submitForm('MYFORMID')"> IMAGE HERE </a>I hope this helps, :)
Regards
d#Nimrod
BTW: I tried to indent the code above, but somehow the code that powers the forum does not allow it.
I'm sorry but I can't get that to work for some reason.
I've just tried using
<a href="#anchor" onClick="document.form1.reset()> IMAGE HERE </a>
and it looks like it will work OK because I can change the 'form1' part with PHP as I draw up the forms.
Is there any reason not to do this? It seems simple enough.
Thanks again
Chris J
The following (updated) code works just fine with my IE:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<SCRIPT type="text/javascript" language="JavaScript">
function getElement(elem)
{
// test which method is supported by the browser
if(document.getElementById)
return document.getElementById(elem);
else if(document.all)
return document.all[elem];
return null;
}function resetForm(formID)
{
// does the form exist?
if((elem = getElement(formID))!= null)
{
// it does exist,
// do whatever you want with the element here (in this case, the form)
elem.reset();
}
}function submitForm(formID)
{
// does the form exist?
if((elem = getElement(formID))!= null)
{
// it does exist,
// do whatever you want with the element here (in this case, the form)
elem.submit();
}
}
</SCRIPT>
<body>
<form name="MyFormID" method="post" action="">
<p>
<input type="text" name="TextFieldID">
</p>
<p> </p>
<p>
<a href="javascript:submitForm('MyFormID');"> IMAGE HERE </a> </p>
</form>
</body>
</html>
But let me ask you: do you really need javascript functions to process the form's submit/reset?
Or is your problem just related with not being able to handle multiple forms in the same page? I mean, if you only want to submit/reset forms without any other additional processing, you don't really need javascript.
d#Nimrod
I've built the rest of the site with one form per page and the image buttons had worked fine until I hit this snag with multiple forms.
Your script works well in IE, brilliant. I can't get it to work in Firebird which is my default browser. As this is an academic project I need it to work cross-browser.
Thanks again,
Chris J
Your script works well in IE, brilliant. I can't get it to work in Firebird which is my default browser. As this is an academic project I need it to work cross-browser.
Sorry about that chris... but give me a sec and i'll try to see what I can come up to, okay?
in all your
<a href="...If you want to submit:
<a href="window.document.MyFormID.submit()"> IMAGE HERE </a>to reset:
<a href="window.document.MyFormID.reset()"> IMAGE HERE </a>'MyFormId' must be changed by the ID of the form you are working on.
i.e.:
<form name="ThisIsFormI" method="post" action="">
<p>
<input type="text" name="TextFieldID">
</p>
<p> </p>
<p>
<a href="window.document.ThisIsFormI.submit()"> IMAGE HERE </a>
<a href="window.document.ThisIsFormI.reset()"> IMAGE HERE </a>
</form> <form name="MySecondForm" method="post" action="">
<p>
<input type="text" name="TextField">
</p>
<p> </p>
<a href="window.document.MySecondForm.submit()"> IMAGE HERE </a>
<a href="window.document.MySecondForm.reset()"> IMAGE HERE </a>
</form>It should work well in Mozilla Firebird.
Try this, and plase let me know how it turned out to be (I am curious now) :)
d#Nimrod
<a href="window.document.MyFormID.submit()">
Does not work, but
<a href="javascript:window.document.MyFormID.submit()">
does.
Same with reset(), 'the javascript:' bit must be at the front other wise the browser tries to load
hxxp://www.myhost.com/window.document.MyFormID.submit()/
which, obviously, doesn't work.
Also, to make things shorter, you can leave out 'window.' and start from 'document.'
Thanks again Nimrod, it's been a long day and I'd have been screwed without your help.
Now, where's that Jack Daniels gone.....
Chris J
Thanks again Nimrod, it's been a long day and I'd have been screwed without your help.
Don't mention it -- I am glad I was helpful.
Now, where's that Jack Daniels gone.....
:)
David
