Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

If it possible to create a multi-level registration process?

Hi Treehouse community!

I was wondering if it was possible to create a registration to a membership site with different roles assigned. For example, I am designing a site that will manage both the clients and employees of a small business. The business works mainly with freelancers, has a high turnover, and these workers are usually recommended by other people who have freelanced for the business.

I was thinking of having a registration form that - along with the usual data fields of name, username, password and email- includes a drop-down menu/radio button option of 'client' or 'freelancer'. And depending on which is chosen when the user creates the account, that user will be given either a client profile or an employee one. As you can imagine, they will be significantly different.

Can this be done? If anyone could point me in the right direction that would be awesome!

1 Answer

It can certainly be done. I don't have much experience with back-end languages, so I'm not sure about how to handle that. However, it would be pretty easy to change the action attribute of an HTML form based on your radio button selection. Would that accomplish what you want?

Assuming your form is called registration and your radio buttons are called role, I think the following jQuery would help you change the action of the form to point to different pages depending on which radio button was clicked.

$(document).ready(function() {  

  // When a radio button is clicked...
  $('input[name="role"]').click(function (){
    if ($(this).val() === "client") {  // If the client button was clicked...
      $('form[name="registration"]').attr("action", "client.html");  // Update the form action to point to the client page.
    } else if ($(this).val() === "employee") { // If the employee button was clicked...
      $('form[name="registration"]').attr("action", "employee.html"); // Update the form action to point to the employee page.
      console.log($('form[name="registration"]'));
    } else {
      console.log("Something went wrong with the radio button click event.");
    }
  }); // end radio select

}); // end document ready 

Hopefully that gets you started. Happy coding!

Yay thanks rydavim! I will give this a shot and post how it goes in this thread. Thanks again, I really don't know much about Javascript