如何在Elementor表单验证CNPJ字段并阻止RD Station接收无效数据

核心问题分析 #

当前的PHP验证仅触发了前端错误提示，但未中断表单提交到RD Station的流程——要么是前端缺失拦截逻辑导致表单直接提交，要么是后端验证没有阻止RD同步代码的执行。

解决方案步骤 #

1. 新增前端即时验证（拦截无效提交） #

给表单提交按钮添加JavaScript验证，确保只有符合要求的CNPJ才能触发提交：

// 根据实际表单元素选择器调整
document.querySelector('.elementor-form-submit').addEventListener('click', function(e) {
    const cnpjInput = document.querySelector('input[name="mascara_cnpj"]');
    const cnpjValue = cnpjInput.value.trim();
    
    // 匹配你设定的验证规则
    if (cnpjValue.length !== 18 || cnpjValue === '00.000.000/0000-00') {
        e.preventDefault(); // 阻止默认提交行为
        // 触发Elementor原生错误提示
        cnpjInput.classList.add('elementor-field-error');
        const errorMsg = cnpjInput.closest('.elementor-field-group').querySelector('.elementor-field-message');
        if (errorMsg) errorMsg.textContent = 'CNPJ Inválido';
        return;
    }
});

2. 强化后端验证（阻止无效数据同步） #

现有PHP验证仅返回错误提示，但未终止后续的RD同步流程。修改代码，在验证失败时直接中断执行：

function validate_cnpj_field($fields) {
    $cnpj = $fields['mascara_cnpj'] ?? '';
    if(strlen($cnpj) < 18 || $cnpj === '00.000.000/0000-00') {
        return ['mascara_cnpj', 'CNPJ Inválido'];
    }
    return true;
}

// 在表单提交处理逻辑中优先调用验证
$validation = validate_cnpj_field($fields);
if(is_array($validation)) {
    // 返回错误提示并终止流程，不执行RD同步代码
    wp_send_json_error($validation);
    exit;
}

确保这段验证逻辑在RD Station的同步脚本之前执行，验证失败则直接终止流程。

3. 调整RD Station脚本的触发时机 #

检查RD Station的嵌入脚本，确保它只在验证通过后才执行。如果当前脚本绑定在表单submit事件上，修改为仅在验证通过时触发同步：

// 封装RD同步逻辑
function syncToRDStation(formData) {
    // 先执行CNPJ验证
    const cnpjInput = document.querySelector('input[name="mascara_cnpj"]');
    const cnpjValue = cnpjInput.value.trim();
    if (cnpjValue.length === 18 && cnpjValue !== '00.000.000/0000-00') {
        // 执行原RD Station同步代码
        rdStationForms.createLead(formData);
    }
}

// 替换原表单提交事件绑定
document.querySelector('.elementor-form').addEventListener('submit', function(e) {
    e.preventDefault();
    const formData = new FormData(this);
    syncToRDStation(formData);
});

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