Having some Grid formatting issues with a grid in a partial view, loaded via ajax function and pass it a parameter.    It appears that the grid is partially created and displayed to soon. I have attached 2 screenshot. to show what is going on. using bootstrap

Basically the process should be call the grid.  the loading.... dialog should be first, then the grid loaded when successfull with norecords shown inside of grid.  This is happening way out of order.  I am probably missing a process..

Main view:

Partial view

Hi,

I have the following grid...

$("#grid").kendoGrid({
            toolbar: ["excel"],
            excelExport: function (e) {
                e.workbook.fileName = "Test.xlsx";
                e.workbook.sheets[0].title = 'Hello World';
              
                var rows = e.workbook.sheets[0].rows;
                e.workbook.sheets[0].rows.unshift({
                    cells: [
                      {
                          value: ''
                      }
                    ],
                });
                e.workbook.sheets[0].rows.unshift({
                    cells: [
                      {
                          value: 'Football: ' + $('input[name=mnuFoot]:checked').val(),
                          bold: true
                      }
                    ],
                });
                e.workbook.sheets[0].rows.unshift({
                    cells: [
                      {
                          value: 'Soccer: ' + $('input[name=mnuSoccer]:checked').val(),
                          bold:  true
                      }
                    ],
    
                });
 
                for (var ri = 0; ri < rows.length; ri++) {
                    var row = rows[ri];

                    if (row.type == "group-footer" || row.type == "footer") {
                        for (var ci = 0; ci < row.cells.length; ci++) {
                            var cell = row.cells[ci];
                            if (cell.value) {
                                 //Use jQuery.fn.text to remove the HTML and get only the text
                                cell.value = $(cell.value).text();
                                //Set the alignment
                                cell.hAlign = "right";
                            }
                        }
                    }
                }
            },

......

How can I export the data using the same functionality as the button on the toolbar using a button outside of the grid?

Thanks,

Liem

HI All,

        Is it possible to convert kendo UI filter textbox to dropdown and bind custom data? I need answer in server side grid. pls see attachment

I have a Kendo MVC Grid that has a column with a DateTime column.    Everything looks good and formats correctly.   When i filter,  it gives me a date picker and a time picker.  When i remove the DateTimeFilter Template below and use template contains,  it will give me a Date picker (which i want),  but still wants to filter by the date and time..     Is there a way i can have the date and time all as the same field,  but only filter with a Date picker.?     Example:  i use the Date picker to pick 07/24/2017 and it filter everything on that date regardless of time..      Or do they need to be completely different fields,  or even concatenated fields in the same column.?

the Column data looks as such:  07/24/2017 18:12:00 

columns.Bound(c => c.CreatedDate).Title("Submitted On")

.ClientTemplate("#= kendo.toString(kendo.parseDate(CreatedDate), 'MM/dd/yyyy HH:mm:ss') #")

.Filterable(ftb => ftb.Cell(cell => cell.Template("DateTimeFilter")));

Hello, and thank you in advance for any and all help.

I do not know if this is a known bug, something I have discovered, or something I am simply doing wrong.

This is how I have my grids set up. However, I notice copy/paste will fail from the grid unless all columns are showing. I use hideColumn() and showColumn() to allow a user to dynamically select what columns they wish to see. Is this a known issue, or is it a strict requirement that all columns have to be showing for copy/paste to work? Is there a workaround, if that is the case?

Thank you again!

I have a application that has a kendo grid.

I can filter the grid using several dropdownlists that are outside the grid.

When I click on search, I add filters to the datasource filter list. For example,

    var dataSource = $("#grid").data("kendoGrid").dataSource;
                var dataSourceFilterQuery = new Array();
   
        if ($("#something").data("kendoDropDownList").value() !== null) {
                        dataSourceFilterQuery.push({ field: "something", operator: "IsGreaterThanOrEqualTo", value: ($("#something").data("kendoDropDownList").value()) });
                }
   
                dataSource.filter(dataSourceFilterQuery);    

Then I get the results I want. It works.
I then have the possibility of saving the values of all the dropdownlists as one filter in localStorage.

     const filtersObject = {
                    Something: whatever.value(),
                    ...
                };
   
                this.storage.setItem("Filter", JSON.stringify(filtersObject));

When I restart the application, the dropdownlists are populated with whatever is in localStorage

    const filter =  JSON.parse(localStorage.getItem("Filter"));
   
                    $("#something").data("kendoDropDownList").value(filters.whatever || "");               
                }

The thing is, I wanted to add these filters, if they exist on localStorage, to the datasource when the application starts so that the user can see the results of the filter he saved when the applications starts and not have to click on search again.

So, what I want is to do apply this

    var dataSource = $("#grid").data("kendoGrid").dataSource;
                var dataSourceFilterQuery = new Array();
   
        if ($("#something").data("kendoDropDownList").value() !== null) {
                        dataSourceFilterQuery.push({ field: "something", operator: "IsGreaterThanOrEqualTo", value: ($("#something").data("kendoDropDownList").value()) });
                }
   
                dataSource.filter(dataSourceFilterQuery);

before the grid is displayed.

Is this possible?

Tks in advance.

I have a page with a Kendo grid and several controls (picture 1).

It works fine, no problem here. I now have to replace the dropdownlist that is open in the picture with a multiselect.

After I changed the drop to a multi, which works just fine, something strange happened ( picture 2).

The layout is all messed up and the grid stopped working.

I change it back to drop and everything is back to normal.

The code for the drop is

@(Html.Kendo().DropDownList()

.Name("Name")

.OptionLabel("Select something...")

...

..BindoTo(new List>SelectListItem>

{

...

}}))

The code for the multiselect is

@(Html.Kendo.MultiSelect()

.Name("Something")

.PlaceHolde("Select something...")

...

.BindTo(new List<SelectListItem>

{

...

}}))

Any ideas?

I need to refresh my PieChart using calculation made in my controller using a DatePicker.

Despite the update of the Viewbag used for the series in my controller, It seems that the series are not updated when refreshing the Chart.

Any suggestions ?

MyView :