vino
vino

Reputation: 302

Wordpress Role based custom registration form

I am trying 2 Role based registration. Ex: Role1, Role2

Once click Registration link then select any Role(role1, role2) after form field automatically change. It's possible ?

Example:
Select Role : (Role1) or (Role2) Once select role form automatically changed.
Role1 Form
Name:
Email:
Address:

Role2 Form
Company Name:
Phone Number:
Company Address:

Thanks.

Upvotes: 1

Views: 1215

Answers (1)

David
David

Reputation: 5937

jquery for a simple answer:

before the get_header() function wp_enqueue_script('jQuery'); wp_enqueue_style('jquery-style', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/themes/smoothness/jquery-ui.css');

your selector element:

   <select name="drop" id="drop">
   <option name="role1">role1</option>
   <option name="role2">role2</option>
   </select>

set your form 2 elements as display none.

Html form:

   <div class="forma" style="display: none;"> 
   question 1
   question 2 
   </div>

   <div class="formhidden"  style="display: none;">
   company name: <input type="text"  name="company" /> 
   </div>

Jquery (enqueue jquery with wp_enqueue('jQuery'); see codex for this. Add the to the page either in the header or footer (escape php) sometimes you need to change position for it to work..)

  <script type="text/javascript">
  jQuery(document).ready(function() {
       jQuery('#drop').change(function() { 

           if(jQuery('#drop').val()=="role2") {
            jQuery('.formhidden').show();
               jQuery('.forma').hide();
           } else {

            jQuery(".forma").show();
               jQuery('.formhidden').hide();
            }

      });
   });

jsfiddle here: http://jsfiddle.net/dheffernan/MHnfe/

now when you select a role, it hides one form and shows the other.

Upvotes: 1

Related Questions