When a chart has a title it is positioned a long way outside of the containing div on which the chart is created.
https://dojo.telerik.com/izARUQ
@(Html.Kendo().ListView(Model.Top100ResortList)
.Name("Top100Resort")
.TagName("ul")
.ClientTemplateId("top100template")
.DataSource(ds =>
{
ds.Read(read => read.Action("_ResortCourses_Read", "Courses"));
ds.PageSize(10);
})
.Pageable()
)
using Kendo.Mvc.UI;
public virtual ActionResult _ResortCourses_Read([DataSourceRequest] DataSourceRequest request)
{
var json = _coursesService.GetTop100Courses(Top100Types.GolfWeekResort).ToDataSourceResult(request);
return Json(json);
}
public virtual ActionResult _ResortCourses_Read([Kendo.Mvc.UI.DataSourceRequest] Kendo.Mvc.UI.DataSourceRequest request)
{
var json = _coursesService.GetTop100Courses(Top100Types.GolfWeekResort).ToDataSourceResult(request);
return Json(json);
}
I want to make a simple example where dragging the slider updates the pie chart.
How?
I don't understand how to makethe graph data depend on the value of the slider.
var viewModel = kendo.observable({
turnips: 35,
coconuts: function() {
data: [{
category: "Big",
value: this.get("turnips"),
color: "#9de219"
}, {
category: "Small",
value: 100 - 10 - this.get("turnips"),
color: "#90cc38"
}, {
category: "As big as your head",
value: 10,
color: "#068c35"
}]
}
});
$(document).ready(function () {
var slider = $("#slider").kendoSlider({
min: 30,
max: 60,
smallStep: 1,
largeStep: 5,
showButtons: false
}).data("kendoSlider");
$("#elt1").kendoChart({
title: {
position: "bottom",
text: "Coconuts"
},
legend: {
visible: false
},
chartArea: {
background: ""
},
seriesDefaults: {
labels: {
visible: true,
background: "transparent",
template: "#= category #: \n #= value#%"
}
},
series: [{
type: "pie",
startAngle: 90,
data: viewModel.coconuts
}],
tooltip: {
visible: true,
format: "{0}%"
}
});
kendo.bind($('#view'), viewModel);
});
Hi, I have a problem removing filter when i remove on filter item or all items with "X", my multiselect keep filtering and i don't have all my original datasource data. Here's my definition of my multiselect control :
$("#searchFilter").kendoMultiSelect({
placeholder: "Catégories de biens et services...",
filter : "contains",
dataTextField: "Name",
dataValueField: "ServiceID",
height: 400,
dataSource: {
data: @(New HtmlString(Json.Encode(Model.ServicesFilter))),
group: { field: "ParentBreadcrumb" },
},
change: function(){
PMEL_SupplierSearch.triggerSearch();
},
filtering: function(ev){
if(ev.filter) {
var filterValue = ev.filter.value;
ev.preventDefault();
this.dataSource.filter({
logic: "or",
filters: [
{
field: "Name",
operator: "contains",
value: filterValue
},
{
field: "Keywords",
operator: "contains",
value: filterValue
}
]
});
}
}
}
});
$(document).ready(
function
() {
var
crudServiceBaseUrl =
"StudentProxyKendo.cfc?method="
,
dataSourcePEP =
new
kendo.data.DataSource({
transport: {
read: {
url: crudServiceBaseUrl +
"getPEP&studentID="
+ studentID +
"&laId="
+ laId +
"&schoolID="
+ schoolID,
dataType:
"json"
},
update: {
url: crudServiceBaseUrl +
"updatePEP"
,
dataType:
"json"
,
type:
"POST"
},
destroy: {
url: crudServiceBaseUrl +
"deletePEP"
,
dataType:
"json"
,
type:
"POST"
},
create: {
url: crudServiceBaseUrl +
"addPEP"
,
dataType:
"json"
,
type:
"POST"
},
Upload: {
url: crudServiceBaseUrl +
"uploadPEP"
,
dataType:
"json"
,
type:
"POST"
},
parameterMap:
function
(options, operation) {
if
(operation !==
"read"
&& options.models) {
return
{models: kendo.stringify(options.models)};
}
}
},
batch:
true
,
pageSize: 10,
schema: {
model: {
id:
"pepid"
,
fields: {
pepid: { editable:
false
, nullable:
true
},
start_date: { type:
"date"
},
comments: { type:
"string"
},
documentsfilenames: { editable:
false
, nullable:
true
},
contributorslist: { type:
"string"
}
}
}
}
});
$(
"#PEPGrid"
).kendoGrid({
dataSource: dataSourcePEP,
pageable:
true
,
height: 150,
toolbar: [
"create"
],
columns: [
{ field:
"start_date"
, title:
"Start Date"
, width:
"140px"
},
{ field:
"comments"
, title:
"Comments"
, width:
"140px"
},
{ field:
"documentsfilenames"
, title:
"Document File Names"
, width:
"140px"
},
{ field:
"contributorslist"
, title:
"Contributors List"
, width:
"100px"
},
{ command: { text:
"Upload"
, click: uploadFile }, title:
" "
, width:
"60px"
},
{ command: [
"edit"
,
"destroy"
], title:
" "
, width:
"110px"
}],
editable:
"popup"
,
create:
true
,
update:
true
,
destroy:
true
});
});
// end ready function
function
uploadFile(e){
console.log(e)
}
Is there a way I can bind to the click event of the control? Doing the following somewhat works, but requires a double click. It seems the first click is being silenced or aborted by the control internally.
this.$el.find(".textbox-debit").click(function() {
console.log("hi!");
});
this.numDebit = this.$el.find(".textbox-debit").kendoNumericTextBox({
format: "c"
}).data("kendoNumericTextBox");
Thank you!
Hi there,
as in this Dojo I can't figure out, how to dynamically change the max value. Could that RangeError be caused by a bug? I expected k-rebind as it would usually work.
Can anyone help with this?
Hello
I'm working with the KendoQRCode Widget that is working fine! I'm also using the exportPDF/SVG/Image functions that all do a great job!
Now I would like to send several created QRCodes (defined in KendoQRCode Widgets) to a single PDF file, so the user can print them all by one PDF file (see attachment). I don't know if that is possible at all so I tried several things. The closest I came to do that:
...
var
qrCode = $(
"#qrcode"
).getKendoQRCode(); // Existing QRCode Widget
var
draw = kendo.drawing;
var
root =
new
draw.Group();
var
code = qrCode.exportSVG({ paperSize:
"A4"
, landscape:
false
}).done(
function
(data) {
root.append(data);
});
draw.exportPDF(root, { paperSize:
"A4"
, landscape:
true
}).done(
function
(data) {
kendo.saveAs({
dataURI: data,
fileName:
"qrcodes.pdf"
});
});
..
The exportImage function does not throw an error but the QRCode is not in the generated PDF file. Using the function exportSVG throws an error: "TypeError: e.transform is not a function. (In 'e.transform()', 'e.transform' is undefined)".
So I wonder how do I send several QRCodes coming from the KendoQRCode Widget(s) into a single PDF file (if possible)? The KendoQRCode Widgets are all displayed in the page and therefore programmatically accessible.
Regards