Placeholder for Filter controls in mvc grid

4 posts, 0 answers
  1. Vidya
    Vidya avatar
    6 posts
    Member since:
    Mar 2016

    Posted 09 Jun 2016 Link to this post

    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?
  2. Boyan Dimitrov
    Admin
    Boyan Dimitrov avatar
    2062 posts

    Posted 12 Jun 2016 Link to this post

    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
     
    Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
     
  3. Vidya
    Vidya avatar
    6 posts
    Member since:
    Mar 2016

    Posted 13 Jun 2016 in reply to Vidya Link to this post

    Hi,

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

    Thanks

  4. Boyan Dimitrov
    Admin
    Boyan Dimitrov avatar
    2062 posts

    Posted 15 Jun 2016 Link to this post

    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
     
    Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
     
Back to Top