javascript event question

#1 February 9th, 2006, 02:55 PM

When there is a HTML Form with lots of input elements, how can I know
which element is triggering the form submit action with the help of
javascript.

#2 February 9th, 2006, 04:35 PM

khng wrote:[color=blue]
> When there is a HTML Form with lots of input elements, how can I know
> which element is triggering the form submit action with the help of
> javascript.[/color]

Let's restore the intended message first ;-)

"I have a HTML form with several SUBMIT buttons in it. When user
submits the form I need to detect which one of submit buttons has been
used. Please help me. Thank you in advance."

You are welcome. This question is not a trivia at all, because onsubmit
the only visible source of event is the form itself. I guess the
possibility to have several submit buttons with different values was
not noticed while designing the form event model.

Good news is that "click" event fires before "submit" event. Bad news
is that you need to loop through all INPUT's to get the right ones and
attach onclick handlers to them. All together it comes to something
like:

<html>
<head>
<title>Detect submit button</title>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
<script type="text/javascript">

var submitter = null;

function validate(f) {
alert(submitter.value);
return false;
}

function getSubmitter(e) {
if ((e)&&(e.target)) {
submitter = e.target;
}
else if ((event)&&(event.srcElement)) {
submitter = event.srcElement;
}
else {
/*NOP*/
}
}

function init() {
var ins = document.forms[0]
.getElementsByTagName('INPUT');
for (var i=0; i<ins.length; i++) {
if (ins[i].type.toLowerCase() == 'submit') {
ins[i].onclick = getSubmitter;
}
}
}

window.onload = init;
</script>
</head>

<body>
<form method="get" action="" onsubmit="return validate(this)">
<input type="submit" name="Submit1" value="Submit1">
<input type="submit" name="Submit2" value="Submit2">
</form>

</body>
</html>

#3 February 12th, 2006, 01:25 PM

VK wrote:[color=blue]
> khng wrote:[color=green]
>> When there is a HTML Form with lots of input elements,
>> how can I know which element is triggering the form
>> submit action with the help of javascript.[/color]
>
> Let's restore the intended message first ;-)[/color]

Are you criticising someone else's English? That is very hypocritical of
you considering that you employ grammar so perverse that about 25% of
what your write is rendered incoherent gibberish from which nobody can
extract meaning.
[color=blue]
> "I have a HTML form with several SUBMIT buttons in it.
> When user submits the form I need to detect which one of[/color]

And if you are going to correct people the least you should do
suggest corrections made of complete sentences. That should
be "When _the_ user submits ...".

<snip>[color=blue]
> ... . Bad news is that you need to loop through all
> INPUT's to get the right ones and attach onclick
> handlers to them. All together it comes to something
> like:[/color]
<snip>[color=blue]
> function getSubmitter(e) {
> if ((e)&&(e.target)) {
> submitter = e.target;
> }
> else if ((event)&&(event.srcElement)) {
> submitter = event.srcElement;
> }
> else {
> /*NOP*/
> }
> }
>
>
> function init() {
> var ins = document.forms[0]
> .getElementsByTagName('INPUT');
> for (var i=0; i<ins.length; i++) {
> if (ins[i].type.toLowerCase() == 'submit') {
> ins[i].onclick = getSubmitter;
> }
> }
> }[/color]
<snip>

So after all this time, and having had it explained to you, and in
considerable detail, you still do not understand that in an event
handler attached to the property od a DOM element that corresponds with
an event handling attribute the - this - keyword reliably refers to the
DOM element itself, so there is not need to mess around with testing or
normalising event objects at all.

It seems that whatever you do you insist upon doing it in the worst
possible way.

Richard.

javascript event question

Popular Articles

What is Bytes?