Hi,

My Requirement is , I have a kendo grid  and I am binding data through Ajax. In My grid I have two columns Customer Number and Status.Customer Number is an Action link column. It must enable when status column is active . If status is Inactive the link column should disbale.

I have a grid-view which contains employee with id and name and a tree-view with cities with name and id and different roles under a cities as child nodes. I am dragging element from the grid and dropping it in the tree view to generate a hierarchy.

I like to prevent dropping duplicate employee under same cities/same roles in the tree view but like to allow drop on a different cities or under different roles in the same city. I have searched and found solution that prevents dropping duplicate element on the entire tree but how to do that on a sub tree level?

hi, 

i need to have a report (done using Grid) load with groups collapsed and showing the group totals.

if i use ClientGroupFooterTemplate it works but looks bad, see attached image.

how do i solve it? ideally i want to the see the group total on the 1st line of the group.  is the ClientGroupHeaderTemplate the answer?  btw, i cant get the Header to work in the same code where Footer code works.  below is the code:

<div id="ReportGridView" style="display: none;">
    @(Html.Kendo().Grid<VolumeViewModel>
        ()
        .Name("ReportGrid")
        .Columns(columns =>
        {
            columns.Bound(o => o.Firm).Width(130).Locked(true);
            columns.Bound(o => o.Collat).Width(70);
            columns.Bound(o => o.UserName).Width(100).Title("User");
            columns.Bound(o => o.Product).Title("Product Type").Width(110);
            columns.Bound(o => o.Symbol).Title("Symbol").Width(100);
            columns.Bound(o => o.Volume).Title("Amount (USD)").Width(160).Format("{0:n0}")
                    .ClientGroupFooterTemplate("Sub-total: #= kendo.toString(sum, \"n2\")#")
                    .ClientFooterTemplate("Period Total: #= kendo.toString(sum, \"n2\")#");
        })
        .ToolBar(tools => tools.Excel())
            .Excel(excel => excel
            .FileName("RevenueReport.xlsx")
            .Filterable(true)
            .AllPages(true)
            .ProxyURL(Url.Action("ExcelExportSave", "ReportGrid"))
            )
        .Sortable()
        .AllowCopy(true)
        .ColumnMenu()
        .Groupable(group => group.ShowFooter(true))
        .Resizable(resize => resize.Columns(true))
        //.Scrollable(scrollable => scrollable.Virtual(true))
        .Scrollable(s => s.Height("400px"))
        .Filterable(filterable => filterable
        .Extra(true)
        .Operators(operators => operators
        .ForNumber(n => n.Clear()
        .IsEqualTo("Is Equal To")
        .IsGreaterThan("Is Greater Than")
        .IsGreaterThanOrEqualTo("Is Greater Than Or Equalt To")
        .IsLessThan("Is Less Than")
        .IsLessThanOrEqualTo("Is Less Than Or Equal To")
        )
        .ForDate(d => d.Clear()
        .IsEqualTo("Is Equal To")
        .IsGreaterThan("Is Greater Than")
        .IsGreaterThanOrEqualTo("Is Greater Than Or Equal To")
        .IsLessThan("Is Less Than")
        .IsLessThanOrEqualTo("Is Less Than Or Equal To"))
        )
        )
        .Selectable(selectable => selectable
            .Mode(GridSelectionMode.Multiple)
            .Type(GridSelectionType.Row)
        )
        .AutoBind(false)
        .DataSource(dataSource => dataSource
            .Ajax()
            .PageSize(100)
            .Model(model =>
            {
                model.Id(p => p.Firm);
                model.Field(p => p.Collat).Editable(false);
                model.Field(p => p.UserName).Editable(false);
                model.Field(p => p.Product).Editable(false);
                model.Field(p => p.Symbol).Editable(false);
                model.Field(p => p.Volume).Editable(false);
            })
        .Read(read => read.Action("Volume", "ReportGrid")
        .Data("GetGridData"))
        .Group(groups =>
        {
            groups.Add(model => model.Firm);
            groups.Add(model => model.Collat);
            groups.Add(model => model.UserName);
            groups.Add(model => model.Product);
            groups.Add(model => model.Symbol);
        })
        .Aggregates(aggregates =>
        {
            aggregates.Add(model => model.Volume).Sum();
        })

        .Events(events => events.Error("onError").Change("onChange"))
        ))
</div>

How to change dynamically row data?

I'm updating my grid with some ajax intervals.

For now I'm using this solution:

But when there is many of rows, grid is staring to lagging.

Is any other way to update rows data? Without re-rendering all grid?

Below is a sample of the column. For some strange reason it does not work with Firefox or Safari on a Mac.

c.Bound(x => x.Active).Title("Active").Width(30).ClientTemplate("<center>#=Active ? 'Yes': 'No' #</center>").HtmlAttributes(new { style = "text-align:center;vertical-align: text-top;" });

Even when i just have this code still won't work.

c.Bound(x => x.Active).Title("Active").Width(30).HtmlAttributes(new { style = "text-align:center;vertical-align: text-top;" });

What happening is, if the row is active it says Yes or No or in the second line it will say true of false. When I click on the column to change the status a checkbox will appear. in either case. But when I try to mark it as checked or not checked it will go back to the text and won't allow me to chenge the status.     

Any ideas how to fix it?

We have to retro fit the KendoUI Grid to existing pages which means the grid has to post back the form when a record is selected so that the details will load for that record and then grid would have to reload the current state (filtering state, page, grouping, etc). I  have managed to make all the work by saving the grid's options that get lost and successfully reloaded the grid. 

The one issue I have now is when I turn on filterable option to Mode: "row", it fails once I set the datasource to the grid.  It comes up with an Length is not defined JS error message and I noticed that the datasource didn't even get a chance to load the data so I'm sure that's part of the reason but I'm curious what is different about setting the mode to row vs true that would cause this.

Here is the snippet of the load data function that worked under filterable = true vs mode = "row":

function () {
            var savedOptions = QuicxKendo.getPageState();
            var pageSize = QuicxKendo.options.pageSize || 15;
    
            if (savedOptions != null) {
                pageSize = savedOptions.pageSize;
            }

            var dataSource = new kendo.data.DataSource({
                transport: {
                    read:
                        function (pageOptions) {
                            QuicxKendo.setPageState(pageOptions.data);
                            var data = "{ options: " + QuicxKendo.stringifyData(pageOptions.data) + "}";

                            $.ajax({
                                type: "POST",
                                url: QuicxKendo.options.dataUrl,
                                datatype: "json",
                                contentType: "application/json; charset=utf-8",
                                data: data,   // ParameterMap does not work when transport methods are using functions
                                success: function (result) {                            
                                    if (result.d.Success) {
                                        if (QuicxKendo.isPostback()) {
                                            var gridOptions = QuicxKendo.getGridOptions();

                                            //-- grouping is lost on postback so set it back in
                                            if (gridOptions) {
                                                QuicxKendo.grid.dataSource._group = gridOptions.dataSource.group;                                        
                                            }
                                
                                            QuicxKendo.setIsPostback(false);                                
                                        }

                                        // notify the DataSource that the operation is complete
                                        pageOptions.success(result);
                                        QuicxKendo.kendoGridSetSelectedRow(QuicxKendo.grid);
                                        $('#' + QuicxKendo.options.detailContainerId).show();
                                    } else {
                                        toastr.error("There was an issue loading the grid.", "Error");
                                        pageOptions.error(result);
                                    }
                                },
                            });
                        }
                },
                serverSorting: true,
                serverPaging: true,
                serverFiltering: true,
                serverGrouping: false,
                pageSize: pageSize,
                schema: {
                    data: "d.Data.Data",
                    total: function (result) {
                        return result.d.Data.Total;
                    },
                    model: JSON.parse(QuicxKendo.columnSchema.schema)
                },
                change: function (e) {
                    QuicxKendo.saveGridState();
                }
            });
    
            if (savedOptions) {
                dataSource._page = savedOptions.page;
                dataSource._sort = savedOptions.sort;
                dataSource._group = savedOptions.group;
                dataSource._filter = savedOptions.filter;
            }
    
            QuicxKendo.grid.setDataSource(dataSource);    
        };

hello there,

There is an common bug in bar chart with the type of "bar", if the value become 0 along with some other negative values, the label of value 0 will overlap the category axis label, please see the attached image.

So here I want move the series label to left of the value axis with the visual function. please refer to telerik demo.

With the visual function, the series label is clipped, and no matter what number of the plot area margin I set , it cannot show the label completely. Is there any way to realize this effect?

It is great if there is a good way to make the label which value is 0 will not overlap the category label.

Thanks in advance.

Am using Kendo datepicker Range for dates showing from date and to date  in my application developing in AngularJs. 

  My requirement is once to date is selected , the from date has to show the dates after  selected to-date as disabled  . I am using k-max = "vm.maxDate" and dates after the to-date is not visible.  Similarly for to-date , the dates prior to from-date is not visible where as it should be disabled as per my requirement .

<input kendo-date-picker k-max = "vm.maxDate" k-rebind = "vm.maxDate" id="fromdate" />

<input kendo-date-picker k-min = "vm.minDate" k-rebind = "vm.minDate" id="todate" />

While loading the page , we are setting the default values as :

    vm.maxDate = new Date();
    vm.minDate = new Date(2000, 0, 1, 0, 0, 0);

Please help me on this