Is it possible to display a helper in a template like this? I'm getting errors. Maybe I'm not formatting it correctly?
columns.Template(template => RenderCustomerActions(template.CustomerID, template.HasMoveHistory));
@helper RenderCustomerActions(int customerID, bool hasMoveHistory)
{
<button type='button' id='openCustomerEditButton' title='Edit Customer' onclick='openCustomerEditWindow(@customerID, false, this);' class='k-button k-button-icon' data-toggle='tooltip'><span class='k-icon k-edit'></span></button>
<button type='button' title='Delete Customer' onclick='deleteCustomer(@customerID, @hasMoveHistory);' class='k-button k-button-icon' data-toggle='tooltip'><span class='k-icon k-delete'></span></button>
<div class="btn-group">
<button type="button" class="btn btn-primary btn-xs dropdown-toggle" data-toggle="dropdown"><i class="fa fa-caret-down"></i></button>
<ul class="dropdown-menu" role="menu">
<li><a onclick="openCustomerPaymentAddWindow(@customerID);">Add Payment</a></li>
</ul>
</div>
}
I've also tried this the dropdown menu will show but it wont expand:
columns.Template(@<text></text>).ClientTemplate("<button type='button' id='openCustomerEditButton' title='Edit Customer' onclick='openCustomerEditWindow(#=CustomerID#, false, this);' class='k-button k-button-icon' data-toggle='tooltip'><span class='k-icon k-edit'></span></button>" +
"<button type='button' title='Delete Customer' onclick='deleteCustomer(#=CustomerID#, #=HasMoveHistory#);' class='k-button k-button-icon' data-toggle='tooltip'><span class='k-icon k-delete'></span></button>" +
"<div class='btn-group'>" +
"<button type='button' class='btn btn-primary btn-xs dropdown-toggle' data-toggle='dropdown'><i class='fa fa-caret-down'></i></button>" +
"<ul class='dropdown-menu' role='menu'>" +
"<li><a onclick='openCustomerPaymentAddWindow(#=CustomerID#);'>Add Payment</a></li>" +
"</ul>" +
"</div>").Title("").Width(100);
I have a drop down list that gets populated with a CompanyID and CompanyName:
HTML:
<select id="MerchantList" kendo-drop-down-list="MerchantList" ng-model="MerchantID" k-options="populateCompanies" class="form-control" required validationmessage="Please select a company"></select>​​
AngularJS:
//populate the kendo drop down control
$scope.populateCompanies = {
dataSource: merchantDataSource,
dataTextField: "CompanyName",
dataValueField: "MerchantID",
//optionLabel: "Please Select Your Company",
filter: "contains",
minLength: 3
};
I also have a user record that contains the CompanyName: $scope.user.CompanyName
How do I select the CompanyName in the drop down list?
Many thanks,
Jayme
​
The PC I'm working on is set to Pacific timezone (America/Los_Angeles). I'm creating a Scheduler in Eastern timezone (America/New_York) and I have a change event setup where I output the value of e.start. If, for example, I click on a 1pm timeslot, I would expect the change event to output 1pm eastern time. It's not, it's outputting 1pm Pacific time. Am I missing something?
Thanks
Here's a small example based on one of the Kendo demos that shows the problem:
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>Kendo UI Snippet</title> <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.930/styles/kendo.common.min.css"> <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.930/styles/kendo.rtl.min.css"> <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.930/styles/kendo.default.min.css"> <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.930/styles/kendo.dataviz.min.css"> <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.930/styles/kendo.dataviz.default.min.css"> <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.930/styles/kendo.mobile.all.min.css"> <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <script src="http://kendo.cdn.telerik.com/2015.3.930/js/kendo.all.min.js"></script> <script src="http://kendo.cdn.telerik.com/2015.3.930/js/kendo.timezones.min.js"></script></head><body> <div id="scheduler"></div><script>$("#scheduler").kendoScheduler({ date: new Date("2013/6/13"), timezone: "America/New_York", selectable: true, change: function (e) { console.log(e.start); }, dataSource: { batch: true, transport: { read: { dataType: "jsonp" }, update: { dataType: "jsonp" }, create: { dataType: "jsonp" }, destroy: { dataType: "jsonp" }, parameterMap: function(options, operation) { if (operation !== "read" && options.models) { return {models: kendo.stringify(options.models)}; } } }, schema: { model: { id: "ID", fields: { ID: { type: "number" }, title: { from: "Title", defaultValue: "No title", validation: { required: true } }, start: { type: "date", from: "Start" }, end: { type: "date", from: "End" }, description: { from: "Description" }, recurrenceId: { from: "RecurrenceID" }, recurrenceRule: { from: "RecurrenceRule" }, recurrenceException: { from: "RecurrenceException" }, ownerId: { from: "OwnerID", defaultValue: 1 }, isAllDay: { type: "boolean", from: "IsAllDay" } } } } }});</script></body></html>Hi
We would like a line chart or sparkline overlaying a KPI span (please see attached picture).
How could we achive this? Thank you.
I'm trying to add a tooltip for a custom symbol in a bubble layer.
I tried adding it directly to the symbol, and I've tried adding it to the layer. If I add it to the symbol it throws an error and won't display any. If I add it to the layer it just doesn't display the tooltip.
{
type: "bubble",
dataSource: SELVEHICLEWITHSTUFF,
locationField: "Location",
valueField: "Value",
symbol: function (e) {
//alert('selVehicle symbol '+e.center+' '+e.location);
var map = $("#map2").data("kendoMap");
//alert(1);
var location = e.location;
if (e.location == null || e.location == [0, 0]) {
//alert(e.dataItem.Name);
var symbol = new draw.Group();
return symbol;
}
else {
if (e.dataItem.Type == "Ping") {
//alert('hola');
var rect = new geom.Rect(
e.center, // Position of the top left corner
[e.dataItem.Value, e.dataItem.Value] // Size of the rectangle
);
var imgString = "/Content/Arrows/Blue/"+e.dataItem.Name+".png";
var image = new draw.Image(imgString, rect);
return image;
}
else {
//alert(2);
var circleGeometry = new geom.Circle(e.center, e.dataItem.Value);
//var rectGeometry = new geom.Rect([e.center[0] - 20, e.center[1] - 10], [e.center[0] + 20, e.center[1] + 10]);
//alert(e.dataItem);
//alert(e.shape);
// Draw the circle shape
//
// http://docs.telerik.com/kendo-ui/api/javascript/dataviz/drawing/circle
//alert(3);
var circle = new draw.Circle(circleGeometry, {
fill: {
color: "#0f0",
opacity: 0.7
},
stroke: {
width: 0
}
});
//alert(4 +' '+e.dataItem.Color);
// Draw the text
//
// http://docs.telerik.com/kendo-ui/api/javascript/dataviz/drawing/text
var text = new draw.Text(e.dataItem.Name, e.center, {//e.dataItem.Name
font: "12px sans-serif"
});
//alert(5+' '+e.dataItem.Name);
// Align it in the circle center
//
// http://docs.telerik.com/kendo-ui/api/javascript/drawing#methods-align
// http://docs.telerik.com/kendo-ui/api/javascript/drawing#methods-vAlign
////////These two lines are throwing errors here, but not in otp.mvc. Not sure why.
//draw.align([text], circle.bbox(), "center");
//draw.vAlign([text], circle.bbox(), "center");
//alert(6);
circle.dataItem = e.dataItem;
circle.bubbleType = e.dataItem.Type;
//alert(7);
text.dataItem = e.dataItem;
text.bubbleType = e.dataItem.Type;
//alert(8);
var symbol = new draw.Group();
symbol.append(circle, text);
symbol.dataItem = e.dataItem;
symbol.bubbleType = e.dataItem.Type;
//symbol.kendoTooltip({
// filter: "a",
// content: "Testing",
// width: 220,
// height: 280,
// position: "top"
//});
//alert(9);
return symbol;
}
}
},
tooltip: {
content: "Austin, TX"
},
},Hi
I have nested object field in Telerik Platform (everlive data) which I want to display in a grid.
I could only manage to display such a nested object value when hardcoding the data in JS as follow:
//HARDODED
var data = [ { "Id": "asdads", "surname": "asdaassadds", "healthRiskAssessment": { "totalAlcoholPerWeek": "test 59" } }];
var dataSource = new kendo.data.DataSource({
data: data
});
$("#kendoGridExportAll").kendoGrid({
dataSource: dataSource,
columns: [ { field: "Id" }, { field: "surname" }, { field: "healthRiskAssessment.totalAlcoholPerWeek" } ]
});​
//---------------
But I could not get the "totalAlcoholPerWeek" field to dosplay while using everlive. See telerik data screenshot. Could you please assist?
//EVERLIVE
var dataSource = new kendo.data.DataSource({ type: "everlive", transport: { typeName: "healthRiskAssessment" }});
$("#kendoGridExportAll").kendoGrid({
dataSource: dataSource,
columns: [{ field: "Id" }, { field: "surname" }, { field: "healthRiskAssessment.totalAlcoholPerWeek" } ]
});​
​
We have a chart that display some metric over the time category axis. We want to correlate the metric data with another widget on the page. For this we need to be able to receive the current position of the crosshair on the time category axis. So the question is - is it possible to subscribe to the crosshair tracking (or some other event) to receive the datetime value from the time category axis when position of crosshair has changed.
Also, when we use time category axis (Date values) and set the baseUnit: "seconds" then chart still shows and plots values only on minute marks. Is there a way to make it more granular (actual seconds) over the datetime axis?
Team ,
Please help us to add a new row in header or footer section in week view of a scheduler.
Thanks in advance.