php – 如何在没有页面刷新的情况下使用ajax保存acf_form

发布时间：2020-12-13 16:03:37 所属栏目：PHP教程来源：网络整理

导读：我有三个acf_form.我想逐个显示这些表单,并且我想在没有页面刷新的情况下通过ajax按钮点击保存每个表单.现在每当我更新时它都是令人耳目一新的页面. 我将通过显示无显示和显示阻止使用js. div class="SetupNew" h2Setup Deals To Attract New Clientele/h2 p

我有三个acf_form.我想逐个显示这些表单,并且我想在没有页面刷新的情况下通过ajax按钮点击保存每个表单.现在每当我更新时它都是令人耳目一新的页面.
我将通过显示无显示和显示阻止使用js.

<div class="SetupNew">
            <h2>Setup Deals To Attract New Clientele</h2>
            <p>Example: buy $15 get $30 for services</p>
            <a href="javascript:void(0)"><p id="newDealsTxt">[Click Here To Setup] </p></a></div>
            <?php acf_form($args =  array(
                                          'post_id' => $post_id,'field_groups' => array(2029),'form_attributes' => array(
                                              'id'=>'newDeals'
                                           ),));  ?>
            <div class="SetupEx">
            <h2>Setup Deals To Bring In Clientele During Nonpeak Hours</h2>
            <p>Example: buy $15 get $30 for services Tue-Thur 9am - 2pm.</p>          
            <a href="javascript:void(0)"><p id="exDealsTxt">[Click Here To Setup]</p></a></div>
            <?php  acf_form($args =  array(
                                          'post_id' => $post_id,'field_groups' => array(2047),'form_attributes' => array(
                                              'id'=>'exDeals'
                                          ),));  ?>
            <div class="SetupFb">
            <h2>Setup $5 Off Coupon To Increase Testimonials And Sharing</h2>
            <p>Example: Leave a testimonial and get $5 off your next service.</p>
            <a href="javascript:void(0)"><p id="fbDealsTxt">[Click Here To Setup] </p></a></div>

            <?php  acf_form($args =  array(
                                          'post_id' => $post_id,'field_groups' => array(2123),'form_attributes' => array(
                                              'id'=>'fbDeals'
                                          ),));  ?>
            <a href="javascript:void(0)"><h2 id="backk">Back << </h2>  </a>

解决方法

这很晚了,但今天我遇到了同样的问题.供参考,这是我的javascript：

// call this function on document ready or when your ajax page is loaded
function renderPage() {
  // initialize the acf script
  acf.do_action('ready',$('body'));

  // will be used to check if a form submit is for validation or for saving
  let isValidating = false;

  acf.add_action('validation_begin',() => {
    isValidating = true;
  });

  acf.add_action('submit',($form) => {
    isValidating = false;
  });

  $('.acf-form').on('submit',(e) => {
    let $form = $(e.target);
    e.preventDefault();
    // if we are not validating,save the form data with our custom code.
    if( !isValidating ) {
      // lock the form
      acf.validation.toggle( $form,'lock' );
      $.ajax({
        url: window.location.href,method: 'post',data: $form.serialize(),success: () => {
          // unlock the form
          acf.validation.toggle( $form,'unlock' );
        }
      });
    }
  });
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!