horos said:
Right, is what you are saying is that can you trigger the javascript to
fire a totally different URL than the one that is specied by a submit
call?
No, but you could if you wanted to. A form provides functionality to
send data to the server without using any JavaScript. You should
allow for the case where your script does not execute and the form is
just submitted. Presumably you are just using JavaScript to make the
submission more efficient for those users that have it available.
So the tactic is to get the form to submit the 'URL' that you want,
an example is below. When 'submit' is clicked, the onsubmit event is
fired. It gets the value from the visible field, adds it to the
hidden field (with a trivial modification), enables the hidden field,
disables the visible field, then returns 'true' so that the form
submits itself with the value of the hidden field in the 'URL'.
You can process the fields and build up whatever string you like in
the hidden field, then just let the form submit it.
I also do some trivial validation - if the text element is empty, an
alert is triggered, the function returns 'false' to the onsubmit
handler, which returns false to the form and so it doesn't submit.
If JavaScript is disabled, the form will just submit with the value
in the visible text field - the hidden field is disabled by default
so it won't be submitted. This way your server knows what it's
getting.
And can onsubmit respond to a javascript submit function?
Yes.
ie: say I had the following javascript:
function download_submit()
{
document.form.myurl=
"
http://www.whatever.com?variable=1&value=1";
This is probably not doing what you think it should.
'document.form' references the form named "form". The next bit
after the dot should match an element name in the form - it is
equivalent to:
document.forms['form'].elements['myurl']
Do you have an element called 'myurl'? If not, you are creating a
'myurl' property of the form and setting its value to "
http://w..."
If you want to set a property of the element, such as its value:
document.form.myurl.value = 'some value';
Presuming that an element named 'myurl' exists in the form called
'form' and it has a value property that can be set.
A form does not have a 'url' (or 'URL') property:
document.form.submit();
}
Bzzzzt. You have onsubmit calling a function that itself calls
submit(), which will fire the onsubmit, which calls the function,
which calls submit()... you are in an endless loop. Have your
function return 'true' and the form will submit itself.
function on_submit()
{
return(document.form.myurl);
I guess this will return something to the onsubmit handler, which
may evaluate it to true (or something other than 'false') and submit
the form ... or not.
}
and the form element was defined as:
<form name="myform" onsubmit="javascript
n_submit()">
No need for the 'javascript:' pseudoprotocol. JavaScript is assumed,
unless you've used some other script type earlier (say VBscript).
... some element using download_submit()
...
</form>
Could you use this to make a call to document.form.myurl? ie: the
download function would call submit, which would in turn call on_submit
to return a url to the form which would then be displayed? Right now,
my testing is saying no, but then again I could be doing something
wrong.
This appears a bit muddled, have a look at the example below.
<script type="text/javascript">
function doSubmit(f){
var t = f.elements['tField'];
// Do some validation
if ( '' == t.value ){
alert('Please put something into the text field');
if (t.focus) t.focus();
// Stop form submitting if test failed
return false;
}
f.elements['hField'].value = 'horos\'s custom field'
+ f.elements['tField'].value;
// Disable visible field
f.elements['tField'].disabled = true;
// Enable hidden field
f.elements['hField'].disabled = false;
// Let form submit
return true;
}
</script>
<body>
<form action="" onsubmit="return doSubmit(this);">
<input type="hidden" name="hField" disabled>
<input type="text" name="tField" value="some text">
<br>
<input type="submit" value="Submit form">
<input type="reset">
</form>
