HOWTO: Fire a connection from the Drop-down view style of the Data View Web Part

Hey there. FrontPage shipped a View Style for the Data View Web Part that doesn't really do anything. The style is the drop-down style. What most people want from this style is the ability to fire connections from it, so I wrote a KB article about this. That is still in draft state, but I've seen this question so many times, I felt I had to post it here as well.

Good luck!

 

1. Insert two Data Views of your data.

2. Select one of the Data Views, choose Style from the Data View Details taskpane.

3. Choose the drop-down box style from the list of styles, click OK.

4. Right click this Data View, choose Web Part connections.

5. Connect to the other Data View as you would normally.

6. Go into Code View.

7. Look for the <a target="_self"> code that looks similar to this (usually, it would be the first <a> tag in the page) and copy the entire block for the first XSL:ATTRIBUTE (see below):

<a target="_self">

<!-- NOTE: start copying here -->
<xsl:attribute xmlns:xsl="https://www.w3.org/1999/XSL/Transform" name="href"><xsl:variable name="cursel">dvt_curselkey={<xsl:value-of select="$CurrentRowKey"/>}</xsl:variable><xsl:variable xmlns:xsl="https://www.w3.org/1999/XSL/Transform" name="fields">@ID=<xsl:value-of select="ddwrt:ConnEncode(string(@ID))"/></xsl:variable>javascript:<xsl:value-of select="ddwrt:GenFireConnection(concat('99d2bb39-f973-482c-a0ca-e49b56eae72d*',$fields),string($cursel))"></xsl:value-of></xsl:attribute>
<!-- NOTE: end copying here-->

<xsl:attribute name="style"><xsl:if test="$CurrentRowKey = $dvt_curselkey">font-weight: bold;</xsl:if></xsl:attribute>
<xsl:value-of select="@Title"/>
</a>

8. Look for the code for the <option> tag. It should be right above the <a> tag.

9. Paste in the section of code you copied above. 

10. Change the name="href" part to name="value". At this point, you should have something like this:

<option style="display:{$GroupStyle}">
<xsl:attribute xmlns:xsl="https://www.w3.org/1999/XSL/Transform" name="value"><xsl:variable name="cursel">dvt_curselkey={<xsl:value-of select="$CurrentRowKey"/>}</xsl:variable><xsl:variable xmlns:xsl="https://www.w3.org/1999/XSL/Transform" name="fields">@ID=<xsl:value-of select="ddwrt:ConnEncode(string(@ID))"/></xsl:variable>javascript:<xsl:value-of select="ddwrt:GenFireConnection(concat('99d2bb39-f973-482c-a0ca-e49b56eae72d*',$fields),string($cursel))"></xsl:value-of></xsl:attribute>
<a target="_self">
<xsl:attribute xmlns:xsl="https://www.w3.org/1999/XSL/Transform" name="href"><xsl:variable name="cursel">dvt_curselkey={<xsl:value-of select="$CurrentRowKey"/>}</xsl:variable><xsl:variable xmlns:xsl="https://www.w3.org/1999/XSL/Transform" name="fields">@ID=<xsl:value-of select="ddwrt:ConnEncode(string(@ID))"/></xsl:variable>javascript:<xsl:value-of select="ddwrt:GenFireConnection(concat('99d2bb39-f973-482c-a0ca-e49b56eae72d*',$fields),string($cursel))"></xsl:value-of></xsl:attribute>
<xsl:attribute name="style"><xsl:if test="$CurrentRowKey = $dvt_curselkey">font-weight: bold;</xsl:if></xsl:attribute>
<xsl:value-of select="@Title"/>
</a>
</option>

11. Look for the <select> tag for the drop down. It should look something like:

<select name="ID" size="1">

12. Add an onchange event handler for the tag, as follows:

<select name="ID" size="1" onchange="eval(this.options.value)">

Now when you change the value your drop-down, your connection should fire.