I’m wondering if there is a way to have multiple submit buttons on the ACF Form. (Hopefully I haven’t missed this if it’s documented somewhere)
What I’m envisioning is having a form to create a new post in which the user has the option to submit it as a draft or submit it as “pending review”. As well as having a front end form to edit the draft with the option to update it or submit it as “pending review”.
I know I could achieve this functionality with a checkbox but from a UI perspective I’d prefer if it were two buttons as that way the user would be guaranteed to see that they have two ways to proceed with creating/updating the post.
ACF only supports a single submit button. The only way to do this is the way you mentioned, with a checkbox or some other type of field to make the setting.
This inserts a second button to an ACF form using jQuery.
The form contains a hidden field ‘current_step’ which is set to a value of ‘1’ for normal submission.
The second button includes onclick=”buttonA_clickHandler(event);” which overrides the saved hidden field ‘current_step’ value to 2.
Its a quick (dirty) hack I have found useful.
<?php
acf_form(array(
‘post_id’ => $user_fact_find_id,
‘field_groups’ => array( 193 ),
‘id’ => ‘step1’,
‘html_after_fields’ => ‘<input type=”hidden” id=”hiddenId” name=”acf[current_step]” value=”1″/>’,
‘label_placement’ => ‘left’,
‘submit_value’ => __(‘Save Step 1’),
‘updated_message’ => __(“Post updated”, ‘acf’),
));
?>
<input type=”submit” id=”myBtn” class=”acf-button2 button button-primary button-large” name=”4″ value=”Next” onclick=”buttonA_clickHandler(event);”>
<script>
jQuery(“#myBtn”).detach().appendTo(‘.acf-form-submit’);
function buttonA_clickHandler(event) {
document.getElementById(‘hiddenId’).value = 2;
document.getElementById(‘step1’).submit();
}
</script>
