Populating a second form from data saved in the database

In this guide we will have a form which will gather some information from the user, generate a booking ID and save the submitted data to a custom database table. We’ll also have a second form which will be populated by the submitted data when the booking ID is given in the URL.

Step 1

Add a Hidden field to the first form, give it a label such as “Booking ID”. On the Data tab of the settings, at the Default value option and enter the value {uniqid}

Step 2

Create the database table to store the intermediary data. In this example, the first form has 6 fields:

  • Booking ID (Hidden)
  • Name (Text)
  • Email (Email)
  • Message (Textarea)
  • Start Date (Date)
  • End Date (Date)

So this is the database table structure I’ve ended up with.

Step 3

In this step we will add the code to save the data from the first form to the table you created in Step 2. Add the following code to the WordPress theme functions.php file (or use a plugin), and configure it as described below the code.

12
3
456
7
89101112
13
14
15
16
17
18
19
add_filter('quform_post_process_1', function ($result, $form) {    global $wpdb;
 
    $startDate = $form->getElement('quform_1_7')->isEmpty() ? '' : $form->getValue('quform_1_7');    $endDate = $form->getElement('quform_1_8')->isEmpty() ? '' : $form->getValue('quform_1_8'); 
    $data = array(
        'id' => $form->getValueText('quform_1_3'),        'name' => $form->getValueText('quform_1_4'),        'email' => $form->getValueText('quform_1_5'),        'message' => $form->getValueText('quform_1_6'),        'start_date' => $startDate,
        'end_date' => $endDate,
    );
 
    $wpdb->insert('bookings', $data);
 
    return $result;
}, 10, 2);
add_filter('quform_post_process_1', function ($result, $form) {
    global $wpdb;

    $startDate = $form->getElement('quform_1_7')->isEmpty() ? '' : $form->getValue('quform_1_7');
    $endDate = $form->getElement('quform_1_8')->isEmpty() ? '' : $form->getValue('quform_1_8');

    $data = array(
        'id' => $form->getValueText('quform_1_3'),
        'name' => $form->getValueText('quform_1_4'),
        'email' => $form->getValueText('quform_1_5'),
        'message' => $form->getValueText('quform_1_6'),
        'start_date' => $startDate,
        'end_date' => $endDate,
    );

    $wpdb->insert('bookings', $data);

    return $result;
}, 10, 2);
  • On line 1 change the number 1 to the form ID
  • On line 4 change both instances of quform_1_7 to the unique ID of the Start Date element
  • On line 5 change both instances of quform_1_8 to the unique ID of the End Date element
  • On line 8 change quform_1_3 to the unique ID of the Booking ID hidden element
  • On line 9 change quform_1_4 to the unique ID of the Name element
  • On line 10 change quform_1_5 to the unique ID of the Email element
  • On line 11 change quform_1_6 to the unique ID of the Message element

Step 4

Create the second form if you haven’t done so already, you should at least have the same fields of the same type as the first form. Add the Hidden field for the Booking ID so you can keep track of it, but you shouldn’t use the Default value option with the uniqid variable for this field in the second form.

Step 5

In this step we will add the code to grab the saved data from the database when the URL is passed a booking_id attribute that matches an existing row in the table. Add the code below and configure it as described below the code.

12
3
4
5
6
7
8
9
10
11
12
13
14
15161718192021
22
23
add_action('quform_pre_display_2', function ($form){
    global $wpdb;
 
    $id = isset($_GET['booking_id']) ? sanitize_text_field(wp_unslash($_GET['booking_id'])) : '';
 
    if (empty($id)) {
        return;
    }
 
    $result = $wpdb->get_row($wpdb->prepare("SELECT * FROM bookings WHERE id = '%s'", $id));
 
    if (is_object($result)) {
        $form->setValues(array(
            'quform_2_3' => $result->id,            'quform_2_4' => $result->name,            'quform_2_5' => $result->email,            'quform_2_6' => $result->message,            'quform_2_7' => $result->start_date,            'quform_2_8' => $result->end_date,        ));
    }
});
add_action('quform_pre_display_2', function ($form)
{
    global $wpdb;

    $id = isset($_GET['booking_id']) ? sanitize_text_field(wp_unslash($_GET['booking_id'])) : '';

    if (empty($id)) {
        return;
    }

    $result = $wpdb->get_row($wpdb->prepare("SELECT * FROM bookings WHERE id = '%s'", $id));

    if (is_object($result)) {
        $form->setValues(array(
            'quform_2_3' => $result->id,
            'quform_2_4' => $result->name,
            'quform_2_5' => $result->email,
            'quform_2_6' => $result->message,
            'quform_2_7' => $result->start_date,
            'quform_2_8' => $result->end_date,
        ));
    }
});
  • On line 1 change the number 2 to the form ID
  • On line 15 change quform_2_3 to the unique ID of the Booking ID hidden element
  • On line 16 change quform_2_4 to the unique ID of the Name element
  • On line 17 change quform_2_5 to the unique ID of the Email element
  • On line 18 change quform_2_6 to the unique ID of the Message element
  • On line 19 change quform_2_7 to the unique ID of the Start Date element
  • On line 20 change quform_2_8 to the unique ID of the End Date element

Step 6

Now if you submit the first form, you’ll get a booking ID shown in the email (or when viewing the entry within WP) for the Hidden field. It’ll look something like 530b2b113e417. If you visit the second form page, and add this ID in the URL like so, it’ll populate the form data.

http://www.example.com/second-form?booking_id=530b2b113e417

Step 7 (optional)

If you want a link in the first form’s notification email to the second form with the booking ID built into it, go to the settings for the notification (Edit Form → Settings → Notifications), then at the Message field add the following code.

1
<a href="https://www.example.com/second-form?booking_id={element|id:3|Hidden}">Booking Link</a>
<a href="https://www.example.com/second-form?booking_id={element|id:3|Hidden}">Booking Link</a>
  • Change http://www.example.com/second-form to the URL of the second form
  • Change the number 3 to the last number of the unique ID of the Booking ID hidden element (the number after the underscore).

Note: If you are testing multiple booking submissions – the booking ID is generated when the first form page is loaded, so you will need to refresh the page after submitting the first booking to generate a new booking ID or the second booking data will not be saved.

Be inspired. © 2020 ThemeCatcher Ltd. 20-22 Wenlock Road, London, England, N1 7GU | Company No. 08120384 | Built with React | Privacy Policy