How to update acf field value when button or link is clicked?

2 Views

I am trying to update an existing ACF field using update_field, when a user clicks on one of the links below. The field is automatically set to “Pending” status when a new event is made. When the event is pending, the user is given the option on the frontend whether to accept or reject the event. Should the event be accepted, for example, the “Pending” in the current field will be updated to “Accepted.” Same case with “Rejected.” This is my HTML: 

<a class="accept-button" onclick="">Accept</a>
<a class="reject-button" onclick="">Reject</a>

This is in the function.php of my theme:

Read More
function accept_event() {
    $value = $_POST['Accepted'];
    update_field('field_53bc53fb91487', $value, $event_id);
}
function reject_event() {
    $value = $_POST['Rejected'];
    update_field('field_53bc53fb91487', $value, $event_id);
}

I’m aware that there are two ways to do this. One that requires a refresh of the page, and another that uses AJAX. I’d prefer to just refresh the page instead of using AJAX. I believe I can achieve this using Javascript? If so, I’m not really sure how to go about it. Any suggestions? Thoughts? Any and all help is much appreciated!

Thanks!

Post Views: 2

Related posts

Leave a Reply

1 comment

  1. you can try the following code

    <a class="accept-button" onclick="updateStatus('Accept')">Accept</a>
<a class="reject-button" onclick="updateStatus('Reject')">Reject</a>

<form action="/updateStatus.php" method="post" name="post-status" id="post-status">
<input name="event_id" value="<?php echo $event_id;?>" type="hidden"/>
<input name="status" id="status" value="" type="hidden"/>
</form>

<script>
   function updateStatus(status) {
      $('#status').val(status);
      $('#post-status').submit();
   }
</script>

    in updateStatus.php

    $value = $_POST['status'];
$event_id = $_POST['event_id'];

update_event_status($value, $event_id) {
    update_field('field_53bc53fb91487', $value, $event_id);
}

// redirect back to your page

    Note: code is not tested so might have some syntax error and you might also need to change a few thing according to your needs but I guess you will get the idea how it will work
    Also this javascript code required the use of jQuery