I have a TimeSpan field called duration that is being returned from MS-Sql Server. I am trying to format that field for display in a grid as mm:ss
I've parsing it as a date for a template but that hasn't worked as I don't believe it is a date.
{
field: "duration",
title: "Duration",
template: "#= kendo.toString(kendo.parseDate(duration), 'mm:ss') #",
width: 120,
filterable: false
},
Any suggestions greatly appreciated.
Can I change the filter to be a treeview if I have a hierarchical data source for it? I've been trying but not seeing any data.If I view the source I can see the treeview and all the data but the filter doesn't show the data on the screen.
My column is defined like this:
field: "country", headerTemplate: '<span title="' + myTranslator.translate("Country", "Country") + '" data-toggle="tooltip" data-placement="right">' + myTranslator.translate("Country", "Country") + '</span>', filterable: { ui: createCountrySelect, extra: false, operators: { string: { contains: myTranslator.translate("Contains", "Contains") } } }, groupHeaderTemplate: kendo.template($("#group-row-template").html())
And the createCountrySelect:
function createCountrySelect(element) { element.removeAttr("data-bind"); var ds = new kendo.data.HierarchicalDataSource({ data: vm.unflattedGeographicUnits, schema: { model: { id: "recordID", hasChildren: function (node) { return (node.items && node.items.length > 0); }, children: { schema: { data: "items", model: { id: "recordID", hasChildren: function (node) { return (node.items && node.items.length > 0); } } } } } } }); element.kendoTreeView({ dataSource: ds, dataTextField: "name", change: function (e) { var filter = { logic: "or", filters: [] }; var values = this.value(); $.each(values, function (i, v) { filter.filters.push({ field: "geographicUnits", operator: "contains", value: v }); }); vm.countryDataSource.filter(filter); } });}
I'm trying to filter my grid using multiple multiselect controls in a toolbar template. They each seem to work separately, sort of, but not completely together as I would like. I know it's just a matter of getting the filtering logic written correctly, but I've been at it for days now and can't seem to get it working 100%. The grid is running in Row filtering mode.
I want to filter multiple columns based on multiple selections.
For simplicity sake, I'll break it down like this:
I have a Species column that might contain: Kokanee, Rainbow Trout, Salmon, Steelhead, Walleye
I have an Area Type column that might contain: Freshwater Lake, River, Marine, Secret
I can get it to filter by a single species, or by a single area type, as the records in the grid can only be of one type, and have one species.
What I want to filter by looks like this: (Kokanee OR Salmon) AND (Freshwater Lake OR River)
I would want to be able to show both of those species, in either of those area types.
My Multiselects look like this:
@(Html.Kendo().MultiSelect()
.Name("areaTypeFilter")
.Placeholder("All Area Types")
.DataTextField("AreaTypeName")
.DataValueField("AreaTypeID")
.AutoBind(true)
.AutoClose(false)
.AutoWidth(true)
.Events(e => e.Change("filterChange"))
.DataSource(ds =>
{
ds.Read("ToolbarTemplate_AreaType", "Reports");
})
)
My filtering function:
function filterChange() {
var filters = [];
var grid = $("#Grid").data("kendoGrid");
if ($("#areaTypeFilter").val()) {
$.each($("#areaTypeFilter").val(), function (key, id) {
filters.push({ field: "AreaTypeID", operator: "eq", value: id });
});
}
if ($("#stateFilter").val()) {
//filter = [];
$.each($("#stateFilter").val(), function (key, id) {
filters.push({ field: "StateID", operator: "eq", value: id });
});
}
if ($("#countyFilter").val()) {
$.each($("#countyFilter").val(), function (key, id) {
filters.push({ field: "CountyID", operator: "eq", value: id });
});
}
if ($("#speciesFilter").val()) {
//filter = [];
$.each($("#speciesFilter").val(), function (key, id) {
filters.push({ field: "SpeciesID", operator: "eq", value: id });
});
}
grid.dataSource.filter({ logic: "and", filters: filters });
}
I've tried changing the logic to OR from AND and that's definitely not the issue. Any help would be appreciated.

````
$("#grid").kendoGrid({
dataSource: {
type: "odata",
transport: {
read: "https://demos.telerik.com/kendo-ui/service/Northwind.svc/Customers"
},
pageSize: 15
},
height:600,
groupable: true,
sortable: true,
pageable: {
refresh: true,
pageSize: 15,
pageSizes: [15,30,50,'all'],
buttonCount: 5
},
columns: [{
template: "<div class='customer-photo'" +
"style='background-image: url(https://demos.telerik.com/kendo-ui/content/web/Customers/#:data.CustomerID#.jpg);'></div>" +
"<div class='customer-name'>#: ContactName #</div>",
field: "ContactName",
title: "联系人",
width: 210
}, {
field: "ContactTitle",
title: "职位"
}, {
field: "CompanyName",
title: "公司"
}, {
field: "Country",
title: "国家",
width: 150
}]
});
```````

Hi,
Could i know if there is an slave content for disabling "arrow" ?
Regards

Hi
I have an master detail grid in Jquery but how could i force "detail" grid in initialisation step ?
Regards


In order to make an example of a real-time changing bullet chart, I hope that it's possible to bind the series data to the value of slider.
Currently I understand chart can use source binding, but I wonder if it's possible to bind one of series data of bullet chart to the value of slider (for example, the current value is bound, and target, category, color are fixed).
Take this for example:
<input data-role="slider" data-bind="value: selectNumber">
<div data-role="chart" data-series="[{ type: 'bullet', currentField: 'current', targetField: 'target', colorField: 'color', target: { color: 'black' } }]" data-bind="source: dsChart"></div>
I hope that I can only bind the current value instead of a whole data source (dsChart) to the value of slider (selectNumber).
Furthermore, I also don't know how to bind the data source (dsChart) to the value of slider (selectNumber).
Can anyone give me a hint or an example?
Thanks.
Hi,
I tried the following code to refresh the list items of a ComboBox widget, but it didn't work. It didn't trigger a data retrieval call. Not sure what's wrong.
widget.dataSource.read();
widget.refresh();
The data source is created as follows:
new kendo.data.DataSource({
serverFiltering: true
transport: {
read: {
url: "xxxx",
dataType: "json",
data: function (e) {
// some code to dynamically prepare the call parameters
},
type: "POST"
}
},
schema: {
data: function (response) {
if (response != null) {
var result = JSON.parse(response);
return (result.Data != null ? result.Data : "");
} else {
return "";
}
}
}
});
Please advise. Thanks.
What I would like to do is call the Save As Excel from an external button, show a progress spinner instead of the button, and when the export is finished show the button again. This is to let the user know longer running exports are processing and not to keep clicking the button.
Here is some example code that fires the hide immediately after the save is called.
$('#export').click(function (e) {
showProgress();
e.preventDefault();
$('#Results').getKendoGrid().saveAsExcel();
// Bug: This processes immediately, need to wait for saveAsExcel to finish.
hideProgress();
});