[Solved] Placeholder for Filter controls in mvc grid

[Vidya]

How to add placeholder for all the filter text boxes in the grid. For date columns the filter text box should show the date format like mm\dd\yyyy. How to achieve this for all columns in the grid?

[Boyan Dimitrov]

Hello Vidya,

In order to customize the filter input element a template should be used. I assume that you are using filter row mode. If so the columns.filterable.cell.template should be used. Otherwise the columns.filterable.cell.template function should be used. 

The ultimate goal is user to be able to define the input element and set its placeholder option.  

Regards,
Boyan Dimitrov
Telerik

 

 

[Vidya]

Hi,

Can you post some example of setting placeholder in MVC grid. 

Thanks

[Boyan Dimitrov]

Hello Vidya,

Please refer to the code snippets below: 

columns.Bound(p => p.OrderDate).Format("{0:MM/dd/yyyy}").Filterable(ftb => ftb.Cell(cell => cell.Template("customDatePicker")));

function customDatePicker(args) {
    args.element.attr("placeholder", "mmddyyyy");
    args.element.kendoDatePicker();
}

The Grid / Filter row is used as a base example. 

Regards,
Boyan Dimitrov
Telerik