使用Ajax僅在Wordpress中從ACF畫廊保存1張圖像

Question

我正在使用ACF畫廊字段來讓用戶在前端創建畫廊，然后進行ajax調用以保存畫廊而無需刷新頁面。

如果刪除ajax保存並使用默認的更新后，則圖庫中的所有圖像均正確保存，但是當我使用ajax保存方法時，僅保存圖庫中的最后一張圖像。

這是我的代碼：

單帖/表格

<?php acf_form_head(); ?>
<?php get_header(); ?>

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>


  <?php $args = array( 

                          'form_attributes' => array(
                          'id'=>'modalAjaxTrying'

                          ),
                          'submit_value' => __("update this badboy",   'acf'),
                        );
            acf_form( $args );  


            ?>



<?php endwhile; endif; ?>
<?php acf_enqueue_uploader();?>
<?php get_footer(); ?>

Ajax保存在JS文件中

jQuery('form#modalAjaxTrying :submit').click(function(event){
 event.preventDefault();
 var form_data = {'action' : 'acf/validate_save_post'};
 jQuery('form#modalAjaxTrying :input').each(function(){
 form_data[jQuery(this).attr('name')] = jQuery(this).val()
})


 form_data.action = 'save_my_data';
 jQuery.post(ajaxurl, form_data)
 .done(function(save_data){
 alert('Added successFully :');

 })
 })

Functions.php

add_action( 'wp_ajax_save_my_data', 'acf_form_head' );
add_action( 'wp_ajax_nopriv_save_my_data', 'acf_form_head' );

Answer 1

任何想要保存Ajax的人都可以在這里與ACF Gallery一起玩。

在您的functions.php中

add_action('acf/submit_form', 'my_acf_submit_form', 10, 2);
function my_acf_submit_form( $form, $post_id ) {

if(is_admin())
    return;

//Test if it's a AJAX request.
if (isset($_SERVER['HTTP_X_REQUESTED_WITH']) &&    !empty($_SERVER['HTTP_X_REQUESTED_WITH']) &&   strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
    echo $form['updated_message'];
    die();
 }

}

add_action( 'wp_ajax_save_my_data', 'acf_form_head' );
add_action( 'wp_ajax_nopriv_save_my_data', 'acf_form_head' );

function my_acf_save_post( $post_id ) {

// get new values
$value = get_field('add_images', $post_id);

在您的JS文件中

acf.do_action('ready', $('body'));

$('form#modalAjaxTrying').on('submit', function(e){
    e.preventDefault();
});

 acf.add_action('submit', function($form){
 $.ajax({
  url: window.location.href,
  method: 'post',
  data: $form.serialize(),
  success: function(data) {
    acf.validation.toggle($form, 'unlock');
            alert(data);
  }
 });
});