Drupal 7 Webform : How to display/hide some fields based on other select option fields

Question

I am using Drupal -7 and webform .. I need to show/hide different fields based on on select option. for eg. select option "Project type"

if I select "Project type" as A => I want to display field1, field2 and select-option3

if I select "Project type" as B => I will display only field3, field4 and select-option4

rest all fields will be displayed in both the cases.

I cant use webform conditional as it doesn't work with select Other. Can anyone help me with the code either "Hook" or "Markup" field in webform.

Solution

Look into the Webform Conditional module. There's a demo here https://www.youtube.com/watch?v=7uxfqJr6K6U which can show you what it's capable of to verify that this is what you're looking for.

Comments

[rinku]

@mmc: Actually I had seen this earlier but it is not compatible with the "Select (or Other)" module. and I am using this module already.

[rinku]

can you suggest some other way of doing it?

[nmc]

@rohit bhatnagar: other way is to write your own javascript to toggle showing/hiding the displays according to your logic.

[mikewink]

Well if you are familiar with the Form API #states system in D7 you can do it in your own custom module. Have a look at: randyfay.com/states for a gentle introduction.

[rinku]

@mnc: how do I add my own java script in webform code? can you please guide me?

[rinku]

@mikewink: I have a custom module of mine. but I dont know How can I change one component based on other.. can you give me some code snippet for a scenario where component "task_title" is hidden based on selecting "BAU" in "type_of_work" select.