One button firing another buttons click event

Question

I'd like two submit buttons on a form i have my team building, one above the fold, and one below. I'm getting complaints from my tech team about adding it because it requires some server side coding to make sure the user doesn't click it more than once. Apparently they have it one button, but to add that validation to two would be a problem.

Can you not just call the button the same thing, with the same ID and wouldn't the form treat it as one button?

Another option I thought would be for new button to fire a click even on the other button. Then they still have one click even for the form, but I get my two buttons. How would I write that?

Thanks, Adma

post your proposed form HTML to get targeted answers – ampersand Sep 23 '11 at 16:51 — ampersand, Sep 23 '11 at 16:51

score 55 · Accepted Answer · answered Sep 23 '11 at 16:52

55

I'm only familiar with ASP.net and C# buttons, but using C# you could wire two different buttons to the same click event handler. You could also do it client side by triggering the primary buttons click event with your secondary button. Here's a VERY simple example:

HTML

<input type="button" id="primaryButton" onclick="ExistingLogic()" />
<input type="button" 
       id="secondaryButton" 
       onclick="document.getElementById('primaryButton').click()" />

answered Sep 23 '11 at 16:52

James Hill

60,353
20
145
161

I should have said, this is HTML - but thats the code im looking for, getting one button to trigger the other – Adam Sep 23 '11 at 16:54
It saves my time. You're Great – Usama Nadeem Jun 06 '19 at 01:39

score 7 · Answer 2 · edited Dec 22 '16 at 10:11

7

<input type="button" id="primaryButton" onclick="ExistingLogic()" />
<input type="button" id="secondaryButton"/>

$('#secondaryButton').click(function(){
    $("#primaryButton").click();
})

edited Dec 22 '16 at 10:11

Eldelshell

6,683
7
44
63

answered Dec 22 '16 at 08:59

Itisha-systematix

155
2
4

This is better for being backend framework/language agnostic, jquery aside. Suggesting an edit for vanilla JS – That Realty Programmer Guy Oct 27 '17 at 05:22
The best way! It helped me so much! – Katarina Perović Mar 21 '20 at 06:43

jessi · Answer 3 · 2022-10-08T17:41:40.210

If you want to use vanillaJS to do this... here is a generic very long way (with functions for both to be clear what is happening).

html

<input type="button" id="primaryButton" />
<input type="button" id="secondaryButton"/>

script

const primary = document.getElementById('primaryButton');
const secondary = document.getElementById('secondaryButton');

function somePrimaryAction(e){
  e.preventDefault();
  console.log('you clicked the primary button');
}

function someSecondaryFunction(e){
  e.preventDefault();
  console.log('you clicked the secondary button');
  primary.click();
}

primary.addEventListener("click", somePrimaryAction, false);
secondary.addEventListener("click", someSecondaryFunction, false);

score 0 · Answer 4 · answered Jul 10 '21 at 22:28

0

Yeezy

<button onclick="$('#button2').click()">button 1</button>
<button id="button2" onclick="doSomethingWhenClick()">button 2</button>

(((You need jQuery to run this)))

answered Jul 10 '21 at 22:28

AHeraldOfTheNewAge

71
5

One button firing another buttons click event

4 Answers4

Linked

Related