One button firing another buttons click event

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 on开发者_C百科ce. 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

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()" />

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

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

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);

Yeezy

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

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