Cascading Dropdowns on a Browser Enabled Infopath Form along with SharePoint

Written By: Abin Jaik Antony -- 9/6/2011 -- join -- contribute -- (9) comments -- printer friendly version

Rating: Rate --

Categories: Design, InfoPath, MOSS 2007, Programming and Customizations, Visual Studio, WSS3

< Prev - 1 | 2 | 3 | 4 | - Next > | Become a paid author


Creating cascading dropdowns in SharePoint presents a difficult challenge. There is nothing built in to "Out of the Box" SharePoint lists and libraries that supports this. However, we can use InfoPath in a variety of ways to meet this challenge. This tip will illustrate one of the solutions, using a custom web service.


This solution illustrates the cascading dropdown of "Products" and "Categories". 

Follow the simple steps to accomplish this task.

1.  Open Microsoft InfoPath 2007 from Start -> All Programs -> Microsoft Office.

2.  Create a blank InfoPath form template using the option “Design a Form Template”. Don’t forget to check the option "Enable Browser Compatible Features" while creating the blank template.

3.  Now we have a blank InfoPath form in front of us. Drag and Drop two dropdowns from the toolbox and name them Categories and Products.

4. Now we need to populate the dropdowns with data. For that we need to create data connections within the InfoPath form. The "Categories" dropdown can be populated directly from the "Categories" SharePoint list. But "Products" dropdown can’t be populated from products SharePoint list, because it is needed to populated according to the selected category. In the next 2 steps we will create data connections for the dropdowns.

5.  Here we create a data connection for the Categories dropdown. Select the “Dataconnections… ” option from the “Tools” menu [menu available on the top portion] of the InfoPath form. From the  “Dataconnections” window, click "add" and on the DataConnection wizard select the “Create new dataconnection” option with the “Receive Data” selection. On the “select the source of your data” step, go with the option “SharePoint Library or List”.

Continue with the wizard. Proceed with the selection of our "Categories" SharePoint List. Once we finish with the DataConnection wizard steps, "Bind" the created "Categories" dataconnection with the “Categories” Dropdown by right clicking on the control. From the “Dropdown list properties”, select the “Look up values from the external datasources” option.

Now there will be a selection with available data connections. Select our categories dataconnection and select the category field for the “Entries” option. Check on the InfoPath preview to see if the data is populated correctly or not.

6.  In this step we will create a data connection for the "Products" dropdown. Here we have to do some more work to create the "Products" data connection.

Before creating the data connection for "Products", we have to create a web service that has the function which returns a set of products according to the category that is being passed.

Create a WSPBuilder project and add a web service item to the project from the WSPBuilder project templates or you can go with other web service creation techniques and deploy it to the SharePoint site. Usually I create SharePoint components with the WSPBuilder . If it is with WSPBuilder, packaging and deployment is quite easy. According to the developer's preference this can be a SharePoint Project using Visual Studio templates as well.

< Prev - 1 | 2 | 3 | 4 | - Next >

Learn more about SharePoint

Sponsor Information

Copyright (c) 2010-2017 Edgewood Solutions, LLC All rights reserved
privacy | disclaimer | copyright | advertise | contribute | feedback | about
Some names and products listed are the registered trademarks of their respective owners. |