Home Kendo Grid UI Filter menu customization have an error
Reply: 0

Kendo Grid UI Filter menu customization have an error

Abuzar
1#
Abuzar Published in 2018-02-10 14:04:55Z

I am having trouble with the filter menu customization example on (https://demos.telerik.com/aspnet-mvc/grid/filter-menu-customization). My code looks similar to it but get an error when I run my web app. However, when I run this I get an error saying:

Cannot convert lambda expression to type "bool" because it is not a delegate type.

This happens on line .Filterable(ftp => ftp.UI("persianDateFilter"))

This is my Index.cshtml file:

@using Kendo.Mvc.UI;
@using Kendo.Mvc.Extensions;

@{
    ViewBag.Title = "Employee";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<div class="container">
    <div class="row">
        @(Html.Kendo().Grid<KendoUiExample.Models.Employee>()
        .Name("EmpGrid")
        .Columns(columns =>
        {
            columns.Bound(c => c.EmployeeID);
            columns.Bound(c => c.FirstName);
            columns.Bound(c => c.LastName);
            columns.Bound(c => c.MyDate).Format("{0:yyyy/MM/dd}")
            .Filterable(ftp => ftp.UI("persianDateFilter"))
            .Width(350);
        })
        .Pageable()
        .Navigatable()
        .Selectable(selectable =>
        {
            selectable.Mode(GridSelectionMode.Single);
            selectable.Type(GridSelectionType.Row);
        })
        .Sortable(sortable =>
        {
            sortable.SortMode(GridSortMode.SingleColumn);
        })
        .Filterable(f => f.Extra(false))
        .Scrollable()
        .DataSource(dataSource => dataSource
        .Ajax()
        .Model(model => model.Id(p => p.EmployeeID))
        .Read(read => read.Action("EmployeeList", "Employees"))
        ))
    </div>
</div>

<script type="text/javascript">
    var persianDateFilter = {

        ui: function (element) {

            var newId = function () {
                var text = "";
                var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz";

                for (var i = 0; i < 10; i++)
                    text += possible.charAt(Math.floor(Math.random() * possible.length));

                return text;
            };

            var el0 = $(element).attr('data-bind').indexOf("filters[0]") !== -1;
            var id = "el" + newId();
            var html = function (elid, index) {
                return "<span class='k-widget'><input type='text' id='" + elid + "' style='text-align:center;' class='k-input k-textbox' data-bind='value:filters[" + index + "].value' autocomplete='false'></span>";
            };

            if (el0) {

                $(element).replaceWith(html(id, 0));

                Calendar.setup({
                    inputField: id,
                    ifFormat: '%Y/%m/%d',
                    dateType: 'jalali',
                    weekNumbers: false,
                    onUpdate: function (cal) {
                        $("#" + id).change();
                    }
                });
            } else {

                $(element).replaceWith(html(id, 1));

                Calendar.setup({
                    inputField: id,
                    ifFormat: '%Y/%m/%d',
                    dateType: 'jalali',
                    weekNumbers: false,
                    onUpdate: function (cal) {
                        $("#" + id).change();
                    }
                });
            }
        }
    };

</script>

What is my mistake?

I Use "Telerik UI for ASP.NET MVC R1 2018" version!

You need to login account before you can post.

About| Privacy statement| Terms of Service| Advertising| Contact us| Help| Sitemap|
Processed in 0.34503 second(s) , Gzip On .

© 2016 Powered by mzan.com design MATCHINFO