Dynamic Data Filtering – Installation

Introduction (see Dynamic Data Filtering home on codeplex)

 Josh Heyes created Dynamic Data Filtering because of missing features searches other that Equals and AND here are some of the filtering capabilities you can add by using Dynamic Data Filtering (Currently for Linq to SQL Dynamic Data Websites)

• Searching ranges (ListPrice > 10 AND ListPrice < 500)
• Searching in a list of possible values (Class in (‘L’, ‘M’))
• Partial text searching (Color LIKE ‘B%’)
• Not null or empty (DiscontinuedDate is not NULL)

Figure 1 – Dynamic Data Filtering sample page

Articles in this series

1. Installation & Adding Dynamic Data Filtering to your site
2. Working with the DynamicFilterRepeater and the DynamicFilterForm
3. Dynamic Data Filtering working with classic Filters and Filters  from Dynamic Data Futures project.
4. Creating and adding custom filters
5. Adding default values to filters

Note:  1 & 2 has been combined. 4. which is now 3. has been removed as this is as easy as having both sets of controls on the page :D

Installation of the Dynamic Data Filtering on codeplex.com (by Josh Heyes)

You will notice that there are several flavours of the install routine:

• Dynamic Data Filtering Installer – Just what you’d expect it installs and adds the controls to the toolbox
• Dynamic Data Filtering Assemblies Only – I think similar the above but does not add any samples etc.
• Dynamic Data Filtering Installer w/o Toolbox Installer – This one is the same as the first but as the name suggests no toolbox entries this is specifically for users with Visual Web Developer 2008 Express which due to it’s cutdownness for some reason does not like the toolbox installed, (Josh did explain on the Forum post where I read this but I can’t remember what it was or be bothered to do a big search on the Forum) so you will have to add the controls to the toolbox yourself if you have Visual Web Developer 2008 Express.

Steps to install and use in new website

1. Download the Dynamic Data Filtering release from the releases page and save and run. 
    
   Figure 2 - Dynamic Data Filtering installation progress
   
2. Then simple enough just follow the instructions.
3. Now if you have Visual Web Developer 2008 Express you will need to add the controls to the toolbox manually.
    

   Create a new tab in the toolbox
   Add Tab	Rename Tab	Browse For Controls
   Click Browse	Navigate to Dynamic Data Filtering folder and Click Open	Check all of the Catalyst controls returned
   You now see the Dynamic Data Filtering controls
   Figures 3 – 9

4. If you installed the Dynamic Data Filtering Installer then you will have an extra Data tab created, just right click on it and select rename and then name it to say DD Filtering just to keep it the same.
5. You’re done and ready to start using Dynamic Data Filtering.

Adding Dynamic Data Filtering to your site

Setup a Dynamic Data Website (I’m going to use a file based website  because you need to do more to get it to work, and because I tend to work with file based websites), I’m going to call it DD_Filtering.

Steps to make the List page use Dynamic Data Filtering  in place of the normal filtering.

1. Replace the LinqDataSource with  a DynamicLinqDataSource

   Just drag the replacement DynamicLinqDataSource to the page. Remember to delete the LinqDataSource first before adding the DynamicLinqDataSource and also to set the ID os the DynamicLinqDataSource to the same ID as the LinqDataSource, ID=”GridDataSource”

   Note: When you insert the first Dynamic Data Filtering control the Dynamic Data Filtering will prompt you to install the FilterTemplate folder click yes
   
   Figure 10 - Install Default Filter Templates

   Delete the old LinqDataSource and then click on the new data source and set the EnableDelete property to true.

2. Replace the FilterRepeater with DynamicFilterRepeater – This is pretty much drag the new control to the page and delete the old control. Again remember to delete the FilterRepeater before adding the DynamicFilterRepeater otherwise the DynamicFilterControl’s ID will need renaming to ID="DynamicFilter" from ID="DynamicFilter0". Also you will need to set the DataSourceID to

   DataSourceID="GridDataSource".

Next we need to do some house keeping of the FilterTemplats add when we added the first Dynamic Data Filtering control, this is specifically for file based website:

 

Figure 11 – Remove the .designer.cs files from the FilterTemplates folder

Next you need to edit both the .ascx and .cs files to remove namespace references that are not required for a file based website and change the CodeBehind property of the control tag to CodeFile.

Here’s the quick way to do it using Visual Studio 2008 replace in files dialogue.

Cleaning up the FilterTemplates

1. Got Edit->Find and Replace->Replace in Files (or type Ctrl+Shift+H) to get the Find and Rplace in files dialogue up.
   
   Figure 12 – Find and Replace in Files dialogue
2. Click the … button at the end of the Look in: textbox and set the selected folder to the DynamicData\FilterTemplates folder of your current website
   
   Figure 13 – Select the Selected folder to the DynamicData\FilterTemplates folder
3. Now in the Find what: textbox enter each of the find text and in the Replace with: the replace text, setting the appropriate Find options and file types in Look at these file types:
4. Repeat step 3 for each row in the following table.

   Find what:	Replace with:	Find options	Look at these file types:
   Inherits="$rootnamespace$.	Inherits="	none	*.ascx
   CodeBehind="	CodeFile="	none	*.ascx
   namespace \$rootnamespace\$\n\{\n		Use: Regular expressions	*.ascx.cs
   \}\n\}	\}	Use: Regular expressions	*.ascx.cs

So if you set your Dynamic Data Website up correctly you could run it now, but you’d see NO filters!

This is because you must attribute up the the field that you want to be filtered. So you will now need to create a partials class file for the model you are using. Again I’m using the Northwind database.

So next we need some Metadata:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.ComponentModel.DataAnnotations;
using System.ComponentModel;
using Catalyst.ComponentModel.DataAnnotations;

[MetadataType(typeof(OrderMD))]
public partial class Order
{
    public class OrderMD
    {
        public object OrderID { get; set; }
        public object CustomerID { get; set; }
        public object EmployeeID { get; set; }
        [Filter(FilterMode=FilterControlMode.Range)]
        public object OrderDate { get; set; }
        public object RequiredDate { get; set; }
        public object ShippedDate { get; set; }
        public object ShipVia { get; set; }
        public object Freight { get; set; }
        public object ShipName { get; set; }
        public object ShipAddress { get; set; }
        public object ShipCity { get; set; }
        public object ShipRegion { get; set; }
        public object ShipPostalCode { get; set; }
        [Filter(FilterMode=FilterControlMode.Contains)]
        public object ShipCountry { get; set; }
        // EntitySets
        public object Order_Details { get; set; }
        // EntityRefs
        [Filter(FilterMode=FilterControlMode.Equals)]
        public object Customer { get; set; }
        [Filter(FilterMode=FilterControlMode.Equals)]
        public object Employee { get; set; }
        [Filter(FilterMode=FilterControlMode.Equals)]
        public object Shipper { get; set; }
    }
}

Listing 1 – Metadata for the Orders table

Some explanation of the filter attribute should be given here:

FilterControlMode	Equivalent to:
Contains	WHERE [Name] Like ‘%something%’
Equals	WHERE [Name] = ‘something’
MultiSelect	WHERE [Name] IN (‘one, two, three’)
Range	WHERE [QTY] > 5 AND [QTY] < 15

 

I believe in the next release there will also be a named parameter of UIHint so you can specify custom FilterTemplates.

Josh Heyes had done a really great job with this.