Hi Chris,
Thank you for the provided details.
Indeed this behaviour is expected because the grid dataSource utilizes the data for the filter and the filterable ui. It is possible to provide your own filterable.cell.template and use the widget's capabilities to render templates, for example here is a runnable Dojo with a DropDownList that contains HTML in its data. Just using the "#=#" syntax renders the values as HTML:
https://dojo.telerik.com/@bubblemaster/EHaBeTIQ
filterable: {
cell: {
enabled: true,
delay: 1500,
template:function(args){
args.element.kendoDropDownList({
dataSource: args.dataSource,
optionLabel:"--Select--",
dataTextField: "name",
dataValueField: "name",
valuePrimitive: true,
template: "#=name#",
valueTemplate:"#=name#"
});
}
}
},
However, to avoid other issues I would recommend the following:
1. Try to avoid keeping the HTML attributes in the DataBase. It is always followed by problems when using the data in the Front End part of the application. If the improvements for the table property in the DataBase is now difficult to be made, try to create a new property, where only he needed data is represented and follow the second step of my responce.
2. In order to achieve the needed behavior try using the column.template property. This approach will work for both the field and the filter values. Here is an example:
columns: [ {
field: "name",
template: "<strong>#: name # </strong>",filterable: {
cell: {
operator: "contains",
suggestionOperator: "contains"
}
}
}]
The full implementation of the approach above could be found in the following dojo example:
Give the above approach a try, and let me know if it works for you, or we should look for another solution.
Kind Regards,
Anton Mironov
Progress Telerik
Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.