Cynthia
Cynthia

Reputation: 5403

How to pass values from one Contact Form 7 form to another in Wordpress?

I have a site that has 2 forms - a short form and a long form. If you look at http://dforbesinsuranceagency.com you'll see the short form next to the masthead photo. The long form is at http://dforbesinsuranceagency.com/request-free-insurance-quotes/

When the user hits Submit on the short form, it kicks them over to the long form page, so that part works fine. The part that gives me fits is that I need the values entered into the short form fields First Name, Last Name, Email Address and Telephone passed to their equivalent fields on the long form.

How do I do this?

This is how I am redirecting the short form to the long form (I added it to the Additional Settings section for the short form):

on_sent_ok: "location = 'http://dforbesinsuranceagency.com//request-free-insurance-quotes';"

Any help would be appreciated.

Upvotes: 8

Views: 14702

Answers (2)

Emissary
Emissary

Reputation: 10148

Hack, hack, hackety, hack hack hack... Without suggesting "not using a form-builder" I don't think there is an elegant solution - you can't use the other PHP method suggested without modifying the plugin itself (and that is a can of worms). I will propose a Javascript solution but there are some caveats (below):

jQuery(document).ready(function($){
  $('#quick-quote form:first').submit(function(){
    var foo = {};
    $(this).find('input[type=text], select').each(function(){
      foo[$(this).attr('name')] = $(this).val();
    });
    document.cookie = 'formData='+JSON.stringify(foo);
  });
  var ff = $('#container form:first');
  if(ff.length){
    var data = $.parseJSON(
      document.cookie.match('(^|;) ?formData=([^;]*)(;|$)')[2]
    );
    if(data){
      for(var name in data){
        ff.find('input[name='+name+'], select[name='+name+']').val(data[name]);
      }
    }
  }
});

What this will essentially do is: on submission, store your mini-form options in a cookie. On page load it will then look for a form in the main body of the page and apply any stored cookie data.

Notes

  • The jQuery selectors are deliberately ambiguous to avoid any future changes in your admin panel/plugin that will likely screw with the form IDs (thus breaking the script).
  • I'm not faffing about pairing field/option names - for example the select box in your mini-form is named insurance-type however the matching box in the main form is named ins-type - you will have to ensure they are of the same name.
  • This also applies to select box values - if there is no matching value, it will be ignored (eg. some of your values in the main form have » » characters in front (and so don't match).

Upvotes: 8

Oscprofessionals
Oscprofessionals

Reputation: 2174

try this.

set the action of our first form to a php file named xyz.php

<form method="post" action="xyz.php">
    <input type="text" name="name">
    <input type="text" name="email_address">
    <input type="submit" value="Go To Step 2">
</form>

the file xyz.php will create a new form for you which in this case is your second form (the big one). Set the action of the form as required. the code of your xyz.php will look something like this.

<form method="post" action="form3.php">
   <input type="text" name="name" value="<?php echo $_POST['name']; ?>">
   <input type="text" name="email_address" value="<?php echo $_POST['email_address']; ?>">
   <input type="radio" group="membership_type" value="Free">

   <input type="radio" group="membership_type" value="Normal">

   <input type="radio" group="membership_type" value="Deluxe">

   <input type="checkbox" name="terms_and_conditions">  
   <input type="submit" value="Go To Step 3">
</form>

where the input fields of the first form will already be filled with the details given by the user in the first form.

You can create the first form by yourself and let the contact form create the second form for you providing the default values using the method above.

Hope this helps!

Upvotes: 2

Related Questions