My admins HATE the way the daterangepicker works, they wanted me to pass it along, I'm not sure where to post.

 

 

Like look at this... 

https://www.screencast.com/t/g3DVcVspyLuf

 

It's like you want to go left, and it goes... down.  What you want to happen isn't happening, it's just off in left field wiping out fields and resetting itself. 

 

I have code that adds buttons to a kendoToolBar.  Upon completion, the button is added but the .items array still says null or undefined.  The basic gist I am ultimately after is how to iterate through the buttons/controls in a toolbar and delete them all or at least delete them one by one by id.  But, I can't figure out the syntax for iterating this array.  Can anyone point out what I'm doing wrong?

 

        var toolbar = $("#tbrMyToolBar").data("kendoToolBar");
 
        toolbar.add(
            { 
                type: "button",
                attributes: { "class": "k-button" },
                text: name, 
                id: "testbutton", 
                togglable: false,
                click: function(e)
                {
                    
                }
            });

         console.log(toolbar.items.length);

I'm testing with the latest Telerik from CDN but the toolbar is missing the date range. Any idea why it won't show? Here is the dojo link:

https://dojo.telerik.com/@slim@revindex.com/UgIxiPAh

 

https://dojo.telerik.com/iliDopep

If we stick a column then apply a filter to another column.

We unstick the column we set previously.

Then clear the filter and the sticky column appears again.

Is this a known issue?

 

Thanks.

 

 

 

I have a problem with treelists in FireFox (Chrome and Edge work fine).

When you resize a column with the mouse to the absolute minimum you can no longer grab the side of the column to widen it again.

Is there a way to set a minimum column size in treelists? If so, I haven't found it.

Thank you for your time,

Hans

Hi,

 

I am using the selectable column to select checkboxes, I need to disable the checkboxes for a few rows based on a value from the dataset for the particular row.

 

On the event of the grid "edit", I am disabling editing for certain rows based on a condition but the checkboxes for those rows can still be checked. I need to prevent/disable checking of the checkbox for the same rows based on the same condition.

 

I have to use the selectable column for checkboxes and not a custom template.

 

I have defined the grid below.

Grid Definition

I am using Kendo UI to display the dynamic menu. How do I make this as Responsive design menu without using kendoResponsivePanel? Do you have any other menu control to have this functionality? Here is my code snippet. Please advise.

@model ghi.Domain.Models.Menu.MenuItemList
@using Kendo.Mvc.UI.Fluent
@using ghi.Domain.Models.Menu
@functions{
    public void addChildren(MenuItemBuilder builder, MenuData item, MenuItemList items)
    {
        var children = items.data.Where(m => m.MenuParentID == item.MenuID);
        if (children != null)
        {
            builder.Items(menuItems =>
            {
                foreach (var child in children)
                {
                    var menuItem = menuItems.Add().Text(child.MenuText);
                    addChildren(menuItem, child, items);
                }
            });

        }
    }
}

@(Html.Kendo().Menu()
    .Name("menu")
    .Items(menu =>
    {
        menu.Add().Text("Home");
        foreach (var item in Model.data.Where(m => m.MenuParentID == null || m.MenuParentID == 0))
        {
            var builder = menu.Add().Text(item.MenuText);
            addChildren(builder, item, Model);
        }
    }))

Hi,

I am following this https://github.com/telerik/kendo-ui-core/blob/master/docs/api/javascript/data/pivotdatasource.md to build a pivot grid. 

How can I check the data source that is used in the following read method? I want to take a look at the structure and build my own olap data source. But when I click the link, it gives 500 error.

Hello dear friends
I wrote a function that is basically a series of images with an animation function, which I want to use as a slider, but when I put it in the setInterval function to do it every 8 seconds, for example, instead of repeating, it delays 8 seconds and once the function Does, the code I wrote:

setInterval(function () { myslider() }, 3000);
    function myslider() {
        $('#slide-one-one').delay(500).fadeIn();
        $('#slide-one-two').delay(1500).animate({ 'opacity': '1', 'top': '150px', 'z-index': '3' });
        $('#slide-titr-one').delay(2500).animate({ 'opacity': '1', 'left': '600px', 'top': '40px', 'font-size': '60px' }, 'fast', function () {
            $('#slide-one').delay(2000).fadeOut(function () {
                $('#slide-two-two').animate({ 'width': '280px', 'height': '437px' }, function () {
                    $('#slide-two-man').animate({ 'bottom': '0px' }, function () {
                        $('#slide-two-titr').fadeIn('slow').animate({ 'left': '750px', 'top': '80px' }, function () {
                            $('#slide-two-one').animate({ 'opacity': '1' }, function () {
                                $('#slide-two').delay(2000).fadeOut(function () {
                                    $('#slide-tree-one').animate({ 'height': '270px' }, function () {
                                        $('#slide-tree-titr').animate({ 'opacity': '1' }, 'slow', function () {
                                            $('#slide-tree-two').fadeIn(function () {
                                                $('#slide-tree-tree').fadeIn(function () {
                                                    $('#slide-tree').delay(2000).fadeOut();
                                                });
                                            });
                                        });
                                    });
                                });
                            });
                        });
                    });
                });
            });
        });
    };

Hello,

I have kendo window that pops up at the click of a link as shown below. Inside the window I have an input box which when changed gets data from the server
and displays the same on the kendo grid. The problem is, once I close the which and I re-open it, the previous data still shows. How can I clear the
currently loaded data on the close of the Kendo window?

Below is my Home/Index.vbhtml and Application/Index.vbhtml (which opens in a window as a partial view)

Regards.

Home/Index.vbhtml

<a href="#" onclick='openWindow()'>Open Window</a>

<div id="Window">@Html.Partial("~/Views/Application/Index.vbhtml")</div>

<script>
    function openWindow() {
        $("#Window").kendoWindow({
            actions: ["Close"],
            width: 1290,
            height: 580,
            modal: true,
            title: "Loan Application",
            visible: false
        }).data("kendoWindow").center();
        $("#Window").data("kendoWindow").open();
    };
</script>


Application/Index.vbhtml

<input autocomplete="off" id="TxtUserID" />

<div id="grid"></div>

<script>
    $(function () {
        $('#TxtUserID').change(function () {
            LoanDataGrid()
        })
    });
</script>

<script>
    function LoanDataGrid() {
        var UserID = $("#TxtUserID").val();

        $("#grid").kendoGrid({
            dataSource: {
                     transport: {
                        read: {
                            data: { UserID: UserID },
                            dataType: "json",
                            url: '@Url.Action("Grid", "Application")',
                        }
                    },
                    schema: {
                        model: {
                            fields: {
                                Id: { type: "string" },
                                Name: { type: "string" },
                                Age: { type: "string" }
                            }
                        }
                },
                pageSize: 1
            },
            toolbar: ["search"],
            height: 205,
            scrollable: true,
            persistSelection: true,
            columns: [
                { field: "Id", title: "Id", width: "50px" },
                { field: "Name", title: "Name" },
                { field: "Age", title: "Age" },
            ]
        });
    };
</script>