Questions on Kendo UI for jQuery Forum

3 answers

436 views

Header Color for Filtered Column in grid

Hi all,

I'm trying to achieve what is outlined in this forum post:

http://www.telerik.com/forums/way-to-show-remind-user-that-a-column-is-applying-a-filter-

(Bascially, I have a grid with the "Bootstrap" theme - and when a filter is applied the filter icon has a slightly greyer background than the rest of the header, however it is difficult to see).

The issue i'm having is that only the filter icon's background changes, (see Example 1.png) - not the whole header. I'd like the whole header to change. I also have attached a copy of the view, can anyone assist?

Grid

answered on 09 Mar 2016

2 answers

328 views

Change datasource of dynamically created chart

Hi,

How can I dynamically create multiple charts and then change their datasource independently?

Thanks

Charts

answered on 09 Mar 2016

3 answers

175 views

[Solved] Gantt inside Kendo Window

I found a very annoying behavior of kendo gantt when I was trying to show it inside a kendo window. The problem occurs only If you have your browser's vertical scrollbar visible, and you scroll down the page. You will see that the page jumps to the top when you try to connect two tasks in Gantt.

Click here to reproduce the problem.

Gantt

answered on 09 Mar 2016

4 answers

1.8K+ views

SourceMaps issue

Not sure if I'm missing something. I see the .map file is there and in the right place, but Chrome isn't loading it. I noticed other files that I use define this explicitly at the end

```
//# sourceMappingURL=app.js.map
```

However, kendo doesn't specify it. If I add it manually, I get one step further, but then Chrome tries to download the file from `myapp.com/src/kendo.core.min.js` instead of getting it from `myapp/kendo/src/js/kendo.core.min.js`. The .map file defines the sourceRoot at the bottom as:

```
`sourceRoot":"../../src/`
```

It works great when I change it to:

```
`sourceRoot":"../src/js/`
```

General Discussions

answered on 09 Mar 2016

3 answers

320 views

Differiante each alternating item in a MobileListView

Hi,

Can't see "altTemplate" implemented in MobileListView. What is the proper way to give each second row a diffenrent color?

ListView (Mobile)

answered on 09 Mar 2016

7 answers

227 views

I can't set Percent Complete

I want set a "percent Complete" to Task but i can't set numbers like 30% or 40% (.30 or .4)0... just i can set 1 or 0 ... I use the arrow in the pop but i just can set 1 and 0 ... what happen there? i need help...

Gantt

answered on 09 Mar 2016

2 answers

254 views

External form editing for current item

Hello,

I'm trying to do prepare a application, that allow to edit the grid's data in external form. The only difference to the example shown in: http://docs.telerik.com/kendo-ui/controls/data-management/grid/how-to/Editing/grid-external-form-editing

is that the edit should work for current item (not selected item), as we want to allow user to select multiply item, but the edit works only in the context of current item.

Generally it works, but after changing any value, there is called the dataBound event of the grid, and I can't get to reselect the current item...

In the selection event I do:

this.currentGridItem = e.sender.current();

and in the databound event i try to:

grid.select(itemsToSelect);
e.sender.current(this.currentGridItem);

but the current item does not get selected and the edit context gets lost (selected items are restored correctly).

Can You help with this? This is quite important scenario for us..

Best regards

Marcin Danek

Grid

answered on 09 Mar 2016

3 answers

880 views

KendoGrid Refresh

I'm using KendoGrid to display some data fetched from my service.
The user selects some parameters (company and date) and cliks on a load button.
The user selects a month on a datePicker and the server will return data from that date plus 11 months.
I only display the grid after the user click on the load button.
Load function:

function loadGrid(e) {

    var companyIds = [1, 3, 7]; // user select it

    var months = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];

    var rowHeaders = ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K"];

    var _dataSource = function () {

        var dataSource = new kendo.data.DataSource({

            transport: {

                read: {

                    url: URL,

                    dataType: "json",

                    data: {

                        companyIds: companyIds,

                        date: kendo.toString(picker.value(), "yyyy-MM-dd") // user select it

                    }

                }

            },

            schema: {

                data: function (data) {

                    // function to handle data returned from server

                    var dataArray = [];

                    var index = 0;

                    for (var key in data[0]) {

                        if (Object.prototype.hasOwnProperty.call(data[0], key)) {

                            var property = key;

                            if (property == "date") {

                                continue;

                            }

                            key = {};

                            key["X"] = rowHeaders[index];

                            index++;

                            for (var i = 0; i < data.length; i++) {

                                var date = data[i].date;

                                var dateSplit = date.split("-");

                                var year = dateSplit[0];

                                var month = months[dateSplit[1] - 1];

                                var header = month + "_" + year;

                                key[header] = data[i][property];

                            }

                            dataArray.push(key);

                        }

                    }

                    return dataArray;

                }

            }

        });

        return dataSource;

    };

    $("#grid").kendoGrid({

        scrollable: false,

        editable: false,

        dataSource: _dataSource()

    });

}

When I click on the load button for the first time, the datasource is loaded and the grid is displayed correctly.
But, for instance, if I change the date on the datePicker and click on the load button again, the datasource is loaded with the correct data (new records for other months), but the grid is not refreshed.
If the first time I select the month Jan/2015, it loads and displays from Jan/2015 until Dec/2015, which is correct.
But if than I select the month Feb/2015, the datasource loads from Feb/2015 until Jan/2016 (correct), but the grid display the columns from Jan/2015 until Dec/2015, which is wrong. In this case, the column Jan/2015 is shown empty and the column Jan/2016 is not displayed.
Can someone point me to the right direction? Thanks!

Grid

answered on 09 Mar 2016

2 answers

280 views

[Solved] Allow cached ajax window content

Hi,

currently a Kendo UI window loads its content with the ajax option "cache" being hard-coded to false.

It would be great if the cache behavior could be configurable in order to allow for:

1) being able to configure the cache and its duration/location on the server. E.g. I'm currently in active development my MVC view actions have different cache durations, based on how often I modify those.

2) avoiding to implement views that are cachable as an object. A cached kendo window object does not help when I'm changing pages. This is really not comparable to browser caching as described in (1).

3) avoiding to implement extra JS logic which takes care of reentrance. My dialogs are fire and forget. I destroy my windows on closing.

I added this suggestion: http://kendoui-feedback.telerik.com/forums/127393-telerik-kendo-ui-feedback/suggestions/12596730-allow-cached-ajax-window-content

Regards

Kasimier Buchcik

Window