How to use dropdownlist control for Kendo UI Grid filter (for version 2015.2.624)

There are two ways for different type of GridFilterMode

1. GridFilterMode.Row

@(Html.Kendo().Grid(this.Model.ToList())
    .Columns(columns =>
    {
        columns.Bound(c => c.AccountCode).Filterable(ftb => ftb.Cell(cell => cell.Operator("startswith")));
        columns.Bound(c => c.AccountName).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")));
        columns.Bound(c => c.AccountType.AccountTypeName).Filterable(flt => flt.Cell(cell => cell.Template("accountTypeFilterTemplate")));
    })
    .Filterable(ftb => ftb.Mode(GridFilterMode.Row))
)
   
}

2. GridFilterMode.Menu

@(Html.Kendo().Grid(this.Model.ToList())
    .Columns(columns =>
    {
        columns.Bound(c => c.AccountCode)
            .Filterable(ftb => ftb.Operators(op => op.ForString(str => str.Clear()
                .StartsWith("Starts with")
                .Contains("Contains")
                .DoesNotContain("Does not contain")
                .IsEqualTo("Is equal to")
                .IsNotEqualTo("Is not equal to")
                .EndsWith("Ends with "))));
        columns.Bound(c => c.AccountName)
            .Filterable(ftb => ftb.Operators(op => op.ForString(str => str.Clear()
                .Contains("Contains")
                .DoesNotContain("Does not contain")
                .StartsWith("Starts with")
                .IsEqualTo("Is equal to")
                .IsNotEqualTo("Is not equal to")
                .EndsWith("Ends with "))));
        columns.Bound(c => c.AccountType.AccountTypeName).Filterable(flt => flt.UI("accountTypeFilter"));
    .Filterable(ftb => ftb.Extra(false))
    })
)

@section scripts{
   
}

Key notes:

 1. for GridFilterMode.Row, we need to use Filterable(flt => flt.Cell(cell => cell.Template("."))), while for GridFilterMode.Menu, we need to use Filterable(flt => flt.Cell(cell => cell.Template(".")))

2. to set the default operator for the filter, it is easier to use GridFilterMode.Row; e.g. Filterable(ftb => ftb.Cell(cell => cell.Operator("contains"))) will make "contains" to be the default operator

3. need to make sure that kendoDropDownList has both properties "dataTextField" & "dataValueField" set properly

4. pay attention to how the template is implemented (different input parameter)

5. the javascript template is very important, if it contains any error, the filter control will either only show the text control (not DropDownList control) or the filter will not behave properly, and it will not raise any error. not sure if there is any way to debug