jQuery cannot trigger button click from another button click

Question

My goal is to replace a button with another button, but I am running into some issues. I am able to trigger the first button click and I am able to cause an alert with the second button click, but for some reason when I try to trigger the first button click in the click event handler of the second button, it doesn't work. What am I doing wrong? For some context, I'm doing this in Powerapps Portals by adding a Content Snippet.

$(window).load(function() {

     //Code to Add Custom 'Register' Button (and Hide the original one- currently commented out)
     $('#SubmitButton').after('<input type="submit" name="ctl00$ctl00$ContentContainer$MainContent$MainContent$mySubmitButton" value="Register" id="mySubmitButton" class="btn btn-primary">');

     //$('#SubmitButton').hide(); *THIS WORKS*
     //$("#SubmitButton").click(); *THIS ALSO WORKS*

     $("#mySubmitButton").click(function()
     {
          //window.alert('yes!'); *THIS WORKS*
          $("#SubmitButton").click(); // *THIS DOES NOT WORK*
     });


});

When I press the button, the page does reload. I'm not sure if the form is being submitted or not- it reloads the page even when I put no input into the forms. I'm working on making a reproducible example! It's a bit difficult for me because Powerapps Portals hides the html/css code on this page. — Girish Tiwari
– Girish Tiwari, Commented Jun 29, 2020 at 21:06
@gt_ Try preventing the default action: $("#mySubmitButton").click(function(e){e.preventDefault(); $("#SubmitButton").click();}); — Unmitigated
– Unmitigated, Commented Jun 29, 2020 at 21:13
@hev1 Wow thank you so much! Worked perfectly! How can I mark that as the answer? — Girish Tiwari
– Girish Tiwari, Commented Jun 29, 2020 at 21:22

Unmitigated · Accepted Answer · 2020-06-29 21:24:15Z

3

You need to prevent the default action to stop the form from submitting when the button is clicked.

$("#mySubmitButton").click(function(e){
    e.preventDefault(); 
    $("#SubmitButton").click();
});

Alternatively, you can set the button's type to "button" so clicking it does not submit the form by default.

$('#SubmitButton').after('<input type="button" name="ctl00$ctl00$ContentContainer$MainContent$MainContent$mySubmitButton" value="Register" id="mySubmitButton" class="btn btn-primary">');

answered Jun 29, 2020 at 21:24

Unmitigated

91.4k12 gold badges102 silver badges109 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

jQuery cannot trigger button click from another button click

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related