Running into a weird issue, we're setting up our grids with javascript for this page. 

 

 $('#assets-grid').kendoGrid({
                dataSource: new kendo.data.DataSource({
                    transport: {
                        read: 'application/GetAssetDetails'
                    },
                    schema: {
                        data: function(response) {
                            var result = [];

                            if (!response.success && response.message) {
                                errorAlert(response.message, 'modalNoteLabel', 10000);
                            }

                            if (response && response.Data) {
                                result = response.Data;
                            }
                            return result;
                        },
                        total: function(response) {
                            var length = 0;
                            if (response && response.Data) {
                                length = response.Data.length;
                            }

                            return length;
                        }
                    },
                    pageSize: 10,
                    serverPaging: false //I added this to fix, also tried serverOperation:false and that didnt work
                }),
                autoBind: false,
                sortable: true,
                scrollable: false,
                pageable: true,
                columns: [
                    {
                        field: 'Column',
                        title: 'olumne',
                        attributes: {
                            'title': '#: Column #'
                        },
                        headerAttributes: {
                            'title': 'column'
                        }
                    },
                    {
                        field: 'Column',
                        title: 'Column',
                        attributes: {
                            'title': '#: Column #'
                        },
                        headerAttributes: {
                            'title': 'Column'
                        }
                    },
                    {
                        field: 'Column',
                        title: 'Column',
                        attributes: {
                            'title': '#: Column #'
                        },
                        headerAttributes: {
                            'title': 'Column'
                        }
                    },
                    {
                        field: 'Column',
                        title: 'Column',
                        attributes: {
                            'title': '#: Column #'
                        },
                        headerAttributes: {
                            'title': 'Column'
                        }
                    }
                ],
                noRecords: {
                    template: "No records are found."
                }
            });

 

Ive added the section in the Datasource for serverPaging: False. 

 

What was happening is when the user loads the gird it would load fine, when they navigated the pages its fine, however if you looked at the network tab in developer tool bar or monitored events on the server you would notice 503 for the request stating that the id coming back is null. I tried to use serverOperation:false but that was still showing the same issue. I switched it to serverPaging and it seems to be resolved. My question is, Is this correct? Is there something else I am missing that should be done to prevent 503's when navigating paging?

Hi,

I'm currently creating Charts dynamically with a mixture of Columns and Lines.

I have two lines in this particular chart 1. Cumulative Total (CT) and 2. Forecast Cumulative Total (FCT).

What I'm trying to achieve is, for this financial year we calculate our "CT" up to the current month/year and anything after that we calculate our "FCT". 

How do i get these lines to match as the end of the period of the "CT" and start of "FCT".

I have attached an example that i can easy do in Excel.

Thanks,

Lee.

I have tried to find som help on why i can't use this binding feature to my excel export part of the mvc grid compoment.

    var grid = $("#grid").data("kendoGrid");
    grid.bind("excelExport", function (e) {
        e.workbook.fileName = "Grid.xlsx";
    });
    grid.saveAsExcel();

 

This i my first beginning of these binding options, and the goal is to use them to hide/show during export.
To get to this goal, is need the first part solved first- my binding fails in the bold line in script performance on website.

 

The error is:Uncaught TypeError: Cannot read property 'bind' of undefined

 

Whay cant i use this bind to capure the excelExport event ??

 

regards

Allan

Is there a way to bind a TreeList to a local datasource like you can with the grid?

With the grid, you can do this: @(Html.Kendo().Grid(Model)

The TreeList doesn't seem to like that.

I am using an editor template to edit an entity that is represented by a view model. I have a grid in the editor template that in order to bind needs to have the primary key of the model passed to it in order to bind the images. How do I accomplish this?? Here is what I am currently doing which is NOT working:

From the grid .DataSource property:

"bind_images" javascript function:

"BindImages" method in the controller:

What is happening is that in the javascript function, the "Key" is always the previously edited record (because I don't know how to get the ID of the record beign currently edities, it looks like I am just grabbing the key of the selected row which is always going to be 1 behind). SO my first issue is how do I get the key of the row being edited?

Secondly, even when a valid ID is passed to the controller method and data is returned, it is never loaded into the grid. What am I doing wrong?

Instead of the .Data and passing a javascript function can't I just add to the route values using the .Route property? If so, how?

Any help is appreciated. Thanks!!

     I've been trying to add a dropdown list to a grid cell for a while now and I can get the dropdown to appear but whenever it changes it doesn't seem to actually save the value.  When I choose a item the save event does end up firing but tabbing off of the field nothing has changed and the put doesn't get hit.  the other fields with just regular text boxes seem to work just fine.

Grid Code:

@(Html.Kendo().Grid<FieldTimeEntry.Web.Repos.Testing.DtsCrewDetLabor>()
                                                                                       .Name("dtsLaborGrid")
                                                                                       .ToolBar(toolbar =>
                                                                                       {
                                                                                           toolbar.Create();
                                                                                           toolbar.Save();
                                                                                       })
                                                                                       .Columns(columns =>
                                                                                       {
                                                                                           columns.Command(command => command.Destroy()).Width(100);
                                                                                           columns.Bound(p => p.EmpName);
                                                                                           columns.Bound(p => p.EmpNo);
                                                                                           columns.Bound(p => p.EmpBillCode);
                                                                                       })
                                                                                      .Editable(editable => editable.Mode(GridEditMode.InCell))
                                                                                      .Pageable()
                                                                                      .Navigatable()
                                                                                      .Sortable()
                                                                                      .Scrollable()
                                                                                          .Events(e =>
                                                                                          {
                                                                                              e.Save("onSave");
                                                                                              e.DataBound("onDataBound");
                                                                                          })
                                                                                       .DataSource(dataSource => dataSource
                                                                                           .Ajax()
                                                                                           .Batch(true)
                                                                                           .PageSize(20)
                                                                                           .ServerOperation(false)
                                                                                           .AutoSync(true)
                                                                                           .Model(m =>
                                                                                           {
                                                                                               m.Field(f => f.GfEmpNo).DefaultValue(Model.GfEmpNo);
                                                                                               m.Field(f => f.CrewCode).DefaultValue(Model.CrewCode);
                                                                                               m.Id(p => p.SeqNo);
                                                                                               m.Field(f => f.EmpNo);
                                                                                           })
                                                                                           .Create(create =>
                                                                                           {
                                                                                               create.Action("Create", "CrewsApi");
                                                                                               create.Type(HttpVerbs.Post);
                                                                                           })
                                                                                           .Read(read =>
                                                                                           {
                                                                                               read.Action("Get", "CrewsAPI", new { id = Model.CrewCode });
                                                                                               read.Type(HttpVerbs.Get);
                                                                                           })
                                                                                           .Update(update =>
                                                                                           {
                                                                                               update.Action("Put", "CrewsAPI");
                                                                                               update.Type(HttpVerbs.Put);
                                                                                           })
                                                                                           .Destroy(destroy =>
                                                                                           {
                                                                                               destroy.Action("Delete", "CrewsAPI");
                                                                                               destroy.Type(HttpVerbs.Delete);
                                                                                           })
                                                                                       ))

Editor Template:

@(Html.Kendo().DropDownList()
          .Name("EmployeeId")
          .DataTextField("NameAlpha")
          .DataValueField("EmployeeId")
          .DataTextField("NameAlpha")
          .DataValueField("EmployeeId")
          .Filter("contains")
          .OptionLabel("Select Employee")
          .AutoWidth(true)
          .DataSource(source =>
          {
              source.Read(read =>
              {
                  read.Action("GetEmployeesFiltered", "ReferenceData");
              })
              .ServerFiltering(true);
          })
          .Animation(a =>
          {
              a.Open(e =>
              {
                  e.Fade(FadeDirection.In);
              });
          }))

 

JS Events:

var lastEditIndex;
        function onSave(e) {
            lastEditIndex.row = this.tbody.children().index(e.container.parent());
            lastEditIndex.col = e.container.parent().children().index(e.container);
        }
 
        function onDataBound(e) {
            var grid = this;
            if (!$.isEmptyObject(lastEditIndex)) {
                var cell = grid.tbody.children().eq(lastEditIndex.row).children().eq(lastEditIndex.col);
 
                grid.current(cell);
                grid.table.focus();
            }
 
            lastEditIndex = {};
        }

 

 

Hello,

We used treelist which inside scrollable div  in our MVC project.  If we configured scrollable= false for treelist all column's width will mess up. If we used default setting (which is scrollable=true) the double scroll bar appeared which is not allowed in project. How to configured scroll bar only horizontally or vertically for Kendo UI treelist ?

Thanks

Hi ,

 

Hope you can help . I have a grid that is using SP via Enity Framework . If I do not using paging it pulls back all the records . However when I enable Paging it shows the correct number of pages but will only show the first 10 records ( or how many I set in PageSize() ) if I click on page 2, 3, , etc I see the same records .

This is my grid 

 

 

I know it`s going to be something simple . It`s not a major requierment to my project but would make it look cleaner .

I'm currently evaluating the Grid control, and managed to build my grid using c# using the html helper. 

My dataset has too many columns to put into one row and I trying to building a child grid using a client template to pass it the additional columns required. 

My c# function contain the bones of the child grid based upon an ExpandoObject, along with a local json array that I would like to insert into the datasource, can you tell me how I am able to achieve this?

var jsonColumns = Newtonsoft.Json.JsonConvert.SerializeObject ( row );

var grid = html.Kendo ().Grid<System.Dynamic.ExpandoObject> ()
       .Name ( "test" )
       .ToClientTemplate();

Hello.

I try to update the item list in the multi checkbox filter popup by a separate datasource defined by a read action:
therefore I followed the instructions from the forum entry on
https://www.telerik.com/forums/refresh-multi-checkbox-filter-options-when-grid-is-filtered

Here a code snippet (MVC/Razor) :

 columns
    .Bound(column.Field)
    .Filterable(f =>
    {

        // check if field shall use checkbox filter
        if (Array.IndexOf(checkboxFilterFields, column.Field) >= 0)
        //if (column.Field == "StateType" || column.Field == "PhaseShortText")
        {
            f.Multi(true); // activate multi checkbox filter

            // setup checkbox filter list
            f.DataSource(ds => ds.Read(r => r
                .Action("ContractFilterListRead", "Contract", new
                {
                    field = column.Field
                }).Data("getFilterListReadParameters")
                )
            );
        }
    });
    
    
with a Javascript part:
    
<script>
    $(document).ready(function () {
        contractsGridController = new GridController('@(gridId)', '@(gridName)');

        //  bind click event of filter popup for checkbox filter list update
        $(".k-grid-filter").click(function (event) {
            //console.log("Gridfilter clicked");

            var fmc = $(event.target).closest("th").data("kendoFilterMultiCheck");
            if (fmc) {
                // update filter popup content
                fmc.checkSource.read();
                fmc.container.empty();
                fmc.refresh();
            }
        });
    });

    // getFilterReaderParameters gets client side filter and sort string
    getFilterListReadParameters = function () {
        console.log("getFilterReaderParameters()");
        var filterAndSortString = contractsGridController.getGrid().dataItem($(".k-grid-content tr")[0]).PFilterAndSortStr; // get filter and sort string of first data item
        console.log("Contract.Index: getFilterReaderParameters() filter and sort string: " + filterAndSortString);
        return { "filterAndSortString": filterAndSortString };
    };
</script>
    
This works like a charm if I use the grid filter mode "GridFilterMode.Menu".
If I switch to "GridFilterMode.Row" and add a Column Menu that contains the checkbox filter menu,
and changing the $(".k-grid-filter").click(function (event) part to $(".k-header-column-menu").click(function (event)
it doesn't work any more since the corresponding "th" element seems not having a kendoFilterMultiCheck object.
How can I access that kendoFilterMultiCheck of the Column Menu to update the item list?

BR, Matthias