如何在Contact Form 7多步骤表单点击下一步时保存当前步骤数据？

1. 利用CF7 Addons插件自带钩子 #

多数CF7扩展插件会提供步骤切换相关的动作钩子，你可以找到插件触发「下一步」按钮时的钩子（比如类似cf7_multistep_before_step_switch这类命名的钩子），在钩子回调里完成数据保存：

• 先查看插件代码或官方文档，定位到步骤切换的触发钩子；
• 编写自定义函数，用get_current_user_id()获取登录用户ID，通过$_POST或插件提供的字段方法拿到当前步骤的表单值；
• 调用数据库插入/更新函数（比如$wpdb->insert()，或复用你当前提交时用的保存逻辑），把数据关联到用户ID存入数据库。

2. 自定义AJAX实现实时保存 #

如果插件没有现成钩子，可自行编写AJAX逻辑：

• 给「下一步」按钮绑定点击事件，阻止默认跳转前，收集当前步骤的所有表单字段值，带上当前用户ID，通过AJAX请求发送到后台；
• 后台注册AJAX处理函数，先验证用户登录状态，接收字段数据后写入数据库；
• 示例代码片段：
  前端JS：

  jQuery(document).on('click', '.cf7-multistep-next-btn', function(e) {
    const $btn = jQuery(this);
    const currentStepData = $btn.closest('.cf7-multistep-step').find('input, textarea, select').serialize();
    const userId = '<?php echo get_current_user_id(); ?>';
  
    jQuery.ajax({
      url: '<?php echo admin_url('admin-ajax.php'); ?>',
      type: 'POST',
      data: {
        action: 'save_cf7_step_data',
        step_data: currentStepData,
        user_id: userId
      },
      success: function() {
        // 保存成功后执行原下一步逻辑
        $btn.off('click').trigger('click');
      }
    });
    e.preventDefault();
  });
  

  后台PHP：

  add_action('wp_ajax_save_cf7_step_data', 'save_cf7_step_data_callback');
  function save_cf7_step_data_callback() {
    if (!is_user_logged_in()) {
      wp_send_json_error('用户未登录');
    }
  
    $userId = intval($_POST['user_id']);
    parse_str($_POST['step_data'], $stepFields);
    
    // 替换为你的实际数据库表名和保存逻辑
    global $wpdb;
    $tableName = $wpdb->prefix . 'cf7_submissions';
    $wpdb->insert(
      $tableName,
      [
        'user_id' => $userId,
        'step_content' => json_encode($stepFields),
        'created_time' => current_time('mysql')
      ],
      ['%d', '%s', '%s']
    );
  
    wp_send_json_success();
  }
  

3. 借助用户元数据临时存储 #

如果不需要直接写入正式业务表，可先把步骤数据存在用户元数据中，最后提交时再合并：

• 步骤切换时，把当前步骤数据序列化后，用update_user_meta($userId, 'cf7_multistep_temp_data', $tempData)存储到用户元数据；
• 最后提交表单时，读取用户元数据里的临时数据，和最后一步的数据合并后写入正式数据库，完成后清空临时元数据。

注意事项 #

• 必须对用户输入做安全处理，用sanitize_text_field()、wp_kses_post()等函数过滤，防止SQL注入和XSS攻击；
• 测试时要验证不同步骤的数据是否正确关联到对应用户，避免数据串库；
• 插件更新后要检查钩子或DOM结构是否变化，及时调整代码。

内容的提问来源于stack exchange，提问作者user813813