Thursday, June 25, 2009

Editing the SharePoint Designer Drop down Box to work when connected to another web part

SharePoint designer allows you to change lists to a data view web part then easily convert them to different layouts, one of which is a dropdown list, which is really cool and would be excellent except when you connect the dropdown list to another web part it doesn’t post back, therefore doesn’t work. So here’s how to fix it:

First we need to add a data view web part and change it to a drop down

Open the page in designer and click Data View, insert Data View
From the Data Source window click on the arrow beside the list or library to add and click show data
Select the required columns then drag them to the where they should be on the page. Don’t worry if you don’t get all the columns they can be changed later. Change to a drop down list by click on the arrow and selecting change layout
We now have a drop down list and need to create a data connection to another web part

Select the arrow and click on web part connections
Leave as send row of data to, and click next
Leave as connect to web part on this page and click next
Select the web part to connect to and click next

Match up the field or fields to pass in and click next

Select the field to create the hyperlink on then click next, and finish

OK, so now we have a drop down that is linked to another list, theoretically this should have worked but go ahead and check and it won’t. So we just need to tweak it a little so it will.
Now this is the fun part.

Click on the drop down box in designer and it will take you to the start of the code for the drop down box, scroll down a little til you get to the start of the option and a target=”_self
You want to remove the a target="”_self"and the closing /a tag
Then change name=”href” to name=”value”


Look for < name="”ID”" size="”1”"> and change it to < name="”ID”" size="”1”" onchange="`eval(this.options.value)`” ">

And that’s it, save the page and now it’ll work

Good luck.