I have a form which takes some settings as input and contains 2 buttons, one to save the form and another one to save and execute the settings.

<form method="post" action="/settings/{{id}}/save">
    <!-- input fields -->
    <button type="submit">Save</button>
    <button type="submit" onclick="saveAndExecute(this)">Save and Execute</button>
</form>

I referred from this answer: https://stackoverflow.com/a/8731806, and added saveAndExecute() function to submit form to different urls by updating the action of the form.

function saveAndExecute(button) {
    const form = button.closest("form");         // To get the form object
    form.submit();                               // Save the form (save url)
    form.action = "/settings/{{id}}/execute";    // Updating the form action url
    form.submit();                               // Execute the setting
    form.action = "/settings/{{id}}/save";       // Update the action url back to original url
}

This is working fine for me, but I'm not sure if this is the correct way to submit form multiple times. Please correct me if I'm wrong, or if there are any other improvements?

Also, after submitting through Save and Execute, my page url also changes (/execute/ is appended after the page url). How can I fix this?

P.S. I'm not experienced in frontend technologies.

P.P.S. I'm not using any frontend framework/library other than jQuery.