Форма перехвата WP / Elementor и перенаправление с данными

Question

У меня есть форма, встроенная в Elementor, которую я хочу перехватить, обработать данные и передать третьему лицу, а затем показать данные на "подтверждающей" карте.

Я могу построить весь этот процесс как одну страницу, выставив каждый из них как не отображаемый с помощью CSS, затем показывая / скрывая с помощью JS, когда я получаю ответы AJAX. Это не идеально, так как ломается с выключенным JS.

Я не смог найти подходящего элемента Elementor и способа наполнения новой страницы PHP, кто-нибудь имел опыт с этим?

Answer 1

Существует несколько способов отправить данные на другой URL из веб-формы Elementor.

Одним из них является использование многих интеграций API, таких как Mailchimp, ActiveCampaign, Zapier и т. Д. (См. https://docs.elementor.com/article/281-form-faq) и ( https://docs.elementor.com/category/405-integrations)

Другой (очень ограниченный метод) - использование действия формы после отправки и выбор "перенаправления", а затем использование краткого кода каждого поля в качестве отдельных строк данных в URL-адресе, таких как:

mysite.com/thank-you?fname=[field id = "fname"] & lname = [field id = "lname"]

Вы даже можете создать свою страницу / благодарности / в Elementor, чтобы ПОЛУЧИТЬ эти данные и заполнить элементы Elementor, такие как текст, заголовок, ссылки и т. Д., Данными поля формы. Например, я мог бы добавить текстовый элемент на страницу /thank-you/ и выбрать динамический вместо того, чтобы вводить текстовую область, а из динамического выпадающего меню выбрать "параметр запроса", а для "типа" выбрать GET и для имя параметра использует ваши уникальные ключи URL, такие как fname, lname и т. д. Вы можете даже установить префикс, суффикс и даже резервный текст вместе с ним.

Наконец, здесь приведена информация о том, как выполнить внутренний код для передачи данных извне ( https://developers.elementor.com/forms-api/).

// A send custom WebHook
add_action( 'elementor_pro/forms/new_record', function( $record, $handler ) {
    //make sure its our form
    $form_name = $record->get_form_settings( 'form_name' );

    // Replace MY_FORM_NAME with the name you gave your form
    if ( 'MY_FORM_NAME' !== $form_name ) {
        return;
    }

    $raw_fields = $record->get( 'fields' );
    $fields = [];
    foreach ( $raw_fields as $id => $field ) {
        $fields[ $id ] = $field['value'];
    }

    // Replace HTTP://YOUR_WEBHOOK_URL with the actuall URL you want to post the form to
    wp_remote_post( 'HTTP://YOUR_WEBHOOK_URL', [
        'body' => $fields,
    ]);
}, 10, 2 );

И поток с множеством примеров интеграции с различными API-интерфейсами с использованием этого шаблона в качестве учебного пособия ( https://github.com/elementor/elementor/issues/2397).