data-columns='[{"field": "ID"}]'
{ field:
"id"
, title:
"Actions"
, template:
"<span class='k-icon k-arrow-next'></span> <span class='k-icon k-delete deleteLink'></span>"
, width: 60, filterable:
false
, sortable:
false
},
Here's a derivative of an another plunk:
http://plnkr.co/edit/6s4lauofvTVDnSgs5Ix2?p=preview
The only change I made was to set the February red point to zero. The marker there is clipped and you only see half the circle.
I read old threads on setting margins, turning off clipping etc but none of those worked for me. Can someone provide a change to the above plunk that shows how to get that marker to show in full?
Hello! I'm trying to make a filter on scheduler resources, it's a quite "heavy" filter because it has to hide not only filtered tasks but also the rows in the DOM. I've succeded to do this behaviour in Timeline* views, as you can see in this dojo example => https://dojo.telerik.com/OxafU/4
The problem is to do such same thing in Month view...seems quite hard because the scheduler html table is very different from Timeline ones.
Could you help me please?
Thanks,
Mattia T.
Hello,
i have a question to the server-side grouping option. The grid is configured with server-side sorting and server-side grouping. The column-sorting runs without errors, but as soon as i group the table is the sorted Data (from a sorted column) not sorted anymore.
After that i logged the data from the server and the data is sorted as it should. Furthermore i tried to sort the data directly on the server, and then i grouped the grid two times (no column sorting in the grid). The result was that the server-sorted column was not sorted anymore. With this test is clear that the grid is sorting the incoming (already sorted) data. Does somebody has any idea how i can fix that issue.
I attached two files with the grid and the server data. The blue rectangle marks the relevant part and the red one the sorted column.
Is there an accepted way to force a grid with incell editing to invoke an update when the user remove focus from the edited cell? We currently use the approach below but it has become unreliable and sometimes does not properly update the UI elements (loading spinner never disapears, dirty indicator doesn't disappear, etc)
ev.Save(@"function(e){
setTimeout(function(){
$('#ExecutionPartGrid').data('kendoGrid').dataSource.sync()})}"
);
I know I'm new to these control, and I've researched, but can't seem to find an answer that works.
I have a grid, and thats now working 100%, but I can't seem to navigate to a url on the selected row click / change? I'm getting a window.location undefined error. I know it's probably something simple I'm overlooking, but I'm just not seeing it yet?
Here is what I have...
$("#agencyListGrid").kendoGrid({
columns: [{
field: "agencyName",
title: "Agency"
},
{
field: "agencyID",
title: "View",
width: 100,
headerAttributes: {
style: "text-align:center"
},
template: '<div style="text-align:center" onclick="navigateToAgency"><i class="fa fa-search fa-lg" aria-hidden="true"></i></div>'
},
{
field: "agencyID",
title: "Archive",
width: 100,
headerAttributes: {
style: "text-align:center"
},
template: '<div style="text-align:center"><i class="fa fa-archive" aria-hidden="true"></i></div>'
}],
dataSource: {
data: this.agencyList.agencies,
pageSize: 15
},
height: 500,
selectable: "row",
scrollable: false,
pageable: {
pageSizes: true,
buttonCount: 5
},
change: function() {
var tempView = $("#agencyListGrid").data("kendoGrid");
//Getting selected item
var selectedItem = tempView.dataItem(tempView.select());
this.window.location = "agencies/" + selectedItem.agencyID;
}
});
}
ERROR MESSAGE:
ERROR TypeError: Cannot set property 'location' of undefined
at init.change (agency-list.component.ts:84)
at init.trigger (eval at webpackJsonp.../../../../script-loader/addScript.js.module.exports (addScript.js:9)
Hello,
The Context: We have a grid that has locked content. But the problem is the height of each row is too large, so I want to reduce it. Adding css to tr doesn't work because kendo will add height attribute to the dom after _adjustRowsHeight.
The solution I have is to adjust the height of the locked table and scollable table in dataBound function, but I want to sync the height of each row in the two tables after this. My question is: Is there a way to sync the height of locked table and the scrollable table without manually calling _adjustRowsHeight method?
Best regards,
Yajing
Hi,
Im not going to pretend to know what is happening here, so I'll just explain how to duplicate it.
I have a demo (https://dojo.telerik.com/iQEtE). Monitor the web console.
1. Create an event, at 10:30am (for example).
2. Resize the event so it starts at 10:00
In the console, I've printed the event object which displays the start time as 10:00, the new time of the event. But on the next line I've explicitly printed the start value and it reads as 10:30, the original time.
I have no idea what is happening, please advise.
Thanks,
Grant
Hi,
I am trying to display a diagram with the following code. I took this from the "Editing" sample posted in Telerik site. After ensuring that it works with the Telerik's data services on my page, I am trying to use it with my own service. This doesn't work. Can someone please help?
Please note: I have intentionally commented the connection piece to first debug the data source piece. I am also attaching a sample of my connections service which returns connections between two entities using LE_Code & F_LE_Code (whose values can be same sometimes. So, we need to add a filter to filter out the items where LE_Code & F_LE_Code are the same). Please suggest how should I specify the connections code and schema?
Code
function visualTemplate(options) {
var dataviz = kendo.dataviz;
var g = new dataviz.diagram.Group();
var dataItem = options.dataItem;
g.append(new dataviz.diagram.Rectangle({
width: 240,
height: 67,
stroke: {
width: 0
},
fill: "#e8eff7"
}));
return g;
}
function onDataBound(e) {
var that = this;
setTimeout(function () {
that.bringIntoView(that.shapes);
}, 0);
}
//function createDiagram() {
//var serviceRoot = "https://demos.telerik.com/kendo-ui/service";
var shapesDataSource = {
batch: false,
transport: {
read: {
url: "Server/SQLService.svc/GetLEData",
dataType: "jsonp"
}//,
//update: {
// url: serviceRoot + "/DiagramShapes/Update",
// dataType: "jsonp"
//},
//destroy: {
// url: serviceRoot + "/DiagramShapes/Destroy",
// dataType: "jsonp"
//},
//create: {
// url: serviceRoot + "/DiagramShapes/Create",
// dataType: "jsonp"
//}
},
schema: {
model: {
id: "id",
fields: {
id: { from: "PID", type: "number", editable: false },
LE_Code: { type: "string" },
LE_Country: { type: "string" }
}
}
}
};
var connectionsDataSource = {
batch: false,
transport: {
read: {
url: serviceRoot + "/DiagramConnections",
dataType: "jsonp"
}
},
schema: {
model: {
id: "id",
fields: {
id: { from: "Id", type: "number", editable: false },
from: { from: "FromShapeId", type: "number" },
to: { from: "ToShapeId", type: "number" },
fromX: { from: "FromPointX", type: "number" },
fromY: { from: "FromPointY", type: "number" },
toX: { from: "ToPointX", type: "number" },
toY: { from: "ToPointY", type: "number" }
}
}
}
};
$("#diagram").kendoDiagram({
dataSource: shapesDataSource,
layout: {
type: "tree",
subtype: "tipover",
underneathHorizontalOffset: 140
},
shapeDefaults: {
visual: visualTemplate,
content: {
template: "#= dataItem.JobTitle #",
fontSize: 17
}
},
connectionDefaults: {
stroke: {
color: "#586477",
width: 2
}
},
dataBound: onDataBound
});
Sample JSON data returned from my GetLEData service
[{"LE_Code":"CO001","LE_Country":"USA","PID":1},{"LE_Code":"CO002","LE_Country":"Canada","PID":2},{"LE_Code":"CO100","LE_Country":"USA","PID":3},{"LE_Code":"CO101","LE_Country":"China","PID":4},{"LE_Code":"CO105","LE_Country":"United States","PID":5},{"LE_Code":"CO110","LE_Country":"United States","PID":6},{"LE_Code":"CO180","LE_Country":"Canada","PID":7},{"LE_Code":"CO210","LE_Country":"Brazil","PID":8}]
Sample JSON data returned from my connections service
[{"AccountID":4,"Country":"Singapore","F_LE_Code":"CO510","Function":4,"LE_Code":"CO510","Label":"OSP","PID":1,"Performed":0,"Return":0,"Treatment":"Cost +","TreatmentID":2},{"AccountID":4,"Country":"Singapore","F_LE_Code":"CO510","Function":4,"LE_Code":"CO510","Label":"OSP","PID":2,"Performed":0,"Return":0,"Treatment":"Cost +","TreatmentID":2},{"AccountID":10,"Country":"China","F_LE_Code":"CO780","Function":7,"LE_Code":"CO527","Label":"Royalty","PID":58,"Performed":1,"Return":0,"Treatment":"% Sales","TreatmentID":1},{"AccountID":10,"Country":"United States","F_LE_Code":"CO780","Function":7,"LE_Code":"CO100","Label":"Royalty","PID":59,"Performed":1,"Return":20,"Treatment":"% Sales","TreatmentID":1},{"AccountID":5,"Country":"Isle Of Man","F_LE_Code":"CO790","Function":2,"LE_Code":"CO790","Label":"CSP","PID":60,"Performed":1,"Return":1,"Treatment":"Cost +","TreatmentID":2},{"AccountID":10,"Country":"China","F_LE_Code":"CO780","Function":7,"LE_Code":"CO527","Label":"Royalty","PID":61,"Performed":1,"Return":0,"Treatment":"% Sales","TreatmentID":1},{"AccountID":10,"Country":"United States","F_LE_Code":"CO780","Function":7,"LE_Code":"CO100","Label":"Royalty","PID":62,"Performed":1,"Return":-2,"Treatment":"% Sales","TreatmentID":1}]
Appreciate your help!
Thanks,
Hi,
When I set "selectable: true" to help to select multiple events on desktop screen but in mobile I can not do it. Is it possible to select multiple events on mobile?
For other things after selecting multiple events how I can open the editor form with these values, currently the scheduler open dialog editor form when we click on one cell.
Thanks in advance!