
I want to initialize a date picker inside a bound view with week numbers like this:
<input name="Deadline" data-bind="value: deadline" data-role="datepicker" data-week-number="true" />
However week numbers wont be displayed. Is this a bug? Here is a dojo link
http://dojo.telerik.com/Ogoyu/2
I cannot use jQuery initialization as I need that binding.
I have disabled Add and Delete always .. But after postback of the page . The options are automatically enabled on rightclick
This is my code :
function detailInitKendoCostGrid(e) {
if (e.data.Id > 0) {
var ds = new kendo.data.DataSource({
schema: {
id: "jobCodeID",
data: "d",
total: "d.length",
model: {
fields: {
Cost: { type: "string" },
Total: { type: "string" },
Desc: { type: "string" },
Quantity: { type: "string" },
}
}
},
pageSize: 500,
transport: {
read: {
url: "Cost.aspx/CostPart",
contentType: "application/json; charset=utf-8",
dataType: 'JSON',
type: "POST",
complete: function (jqXhr, textStatus) {
if (textStatus === 'error') {
var message = $.parseJSON(jqXhr.responseText).Message;
ShowMessageDialog(message);
}
}
},
parameterMap: function (options, operation) {
// ////
switch (operation) {
case "read":
return JSON.stringify({
"jobcodeId": e.data.Id,
});
break;
default:
return JSON.stringify(options);
break;
}
}
}
});
$("<div style='height: 400px'/>").appendTo(e.detailCell).kendoGrid({
dataSource: ds,
columns: [
{ field: "Cost", title: "Task", width: "500px" },
{ field: "Total", title: " Part Number", width: "100px" },
{ field: "Desc", title: "Part Description", width: "100px" },
{ field: "Quantity", title: "Quantity", width: "100px" },
],
selectable: true
});
}
}
function SetContextMenuforCost()
{
var taskPartGridId = "#Kendo_CostGrid";
$("#E_ContextMenu").kendoContextMenu({
dataSource: [{ text: "Add Cost" },
{ text: "Edit Cost" },
{ text: "Delete Cost" }],
target: CostGridId,
filter: ".k-detail-row tbody tr.k-state-selected[role='row']",
open: function (e) {
showopen(e);
},
select: function (e) {
ShowGridPopup(e);
},
});
$("#E_ContextMenu").kendoMenu().data("kendoMenu").enable("li:eq(1)", true);
$("#E_ContextMenu").kendoMenu().data("kendoMenu").enable("li:eq(0)", false);
$("#E_ContextMenu").kendoMenu().data("kendoMenu").enable("li:eq(2)", false);
}
function showopen(e) {
var menu = e.sender;
if (menu != null) {
var total= e.target.childNodes[3].textContent;
if (quantity > 0) {
$("#E_ContextMenu").kendoMenu().data("kendoMenu").enable("li:eq(1)", true);
$("#E_ContextMenu").kendoMenu().data("kendoMenu").enable("li:eq(0)", false);
$("#E_ContextMenu").kendoMenu().data("kendoMenu").enable("li:eq(2)", false);
}
}
}

Hi,
I have a grid with multiple gauges inside of it. The gauges represent measure values. Because the measures changes in real time I have to constantly reload the gauges with the new measures.Also, the user can decide that it doesn't want to display a specific measure, I have to reload them in this case too.
So the only way that I found to do this is to create all my gauges and destroy them once I get the new measures values or when the user decide he doesn't want a measure anymore.
The problem is that I have a lot of memory leaks while doing this process again and again.
I manage to reproduce the bug on kendo dojo using random data (same behavior as my code)
is there a way to avoid all that memory leaks.
ps : I use google chrome (use More tools>task manager too see how many kb a tab is using)
Any help will be appreciated
Hello,
I am facing couple of issues in KendoGrid.
1. I wanted to add a new row once user starts editing the last row, but I need focus on current row. Currently, when i start editing, new row is added but focus shifts on new row.
2. Need an indicator for all the new Row added
3. Can we fire validation on complete row instead of a cell?
Please help if there is any possibility.
Thanks in anticipation.
Kranthi
Hello,
Currently I'm having an issue with a Custom Filter in my Grid. I'm trying to get all our function groups from our server and make those filterable in the Grid.
However the name I want to use for filtering isn't found in the Grid schema and throwing an error.
To fill my Grid i'm using odata-v4 and Extending it with extra data. The problem is i'm trying to create the custom filter on data in the Extended object I get from odata. However when i try to apply the filter I get the error message "ReferenceError: Employee is not defined".
I've tested what happens if I try to apply the filter to a field in the base schema of the Grid's datasource and then the data is retrieved as expected.
So my question is how can I apply the filter to an attribute in the Extended object?
Kendo Grid Schema
01.schema: {02. total: function(data) {03. return data["@odata.count"];04. },05. model: {06. id: "EmployeeId",07. fields: {08. EmployeeId: { type: "number", editable: false },09. EmployerBudgetId: { type: "boolean" },10. Id: { type: "string" },11. CreatedDate: { type: "string", defaultValue: new Date().toISOString() },12. CreatedBy: { type: "string" },13. LastModifiedDate: { type: "string", defaultValue: new Date().toISOString() },14. LastModifiedBy: { type: "string" },15. Description: { type: "number" },16. StartDate: { type: "number" },17. EndDate: { type: "number" },18. }19. }20.},KendoGrid Datagrid
01.$scope.datagrid = {02. dataSource: dataSource,03. pageable: true,04. filterable: true,05. sortable: true,06. selectable: true,07. height: 800,08. toolbar: ['create', { name: 'edit', title: 'Bulk Edit', template: '<a ng-click="bulkEdit()" class="k-button k-button-icontext k-grid-edit">Bulk Edit</a>' }],09. columns: [10. { title: 'select', template: '<input class="checkbox" type="checkbox" />' },11. { field: "Employee.Email", title: "Email" },12. { field: "Employee.LocalFunctionGroup", title: "Local Function Group" },13. {14. field: 'Employee.FunctionGroup.Name', // Custom Filter (on extended data)15. title: "Global Function Group",16. filterable: {17. multi: true,18. dataSource: filterDatasource,19. dataTextField: "Name"20. },21. template: '# if (Employee.FunctionGroup != null) { # #: Employee.FunctionGroup.Name # # } #',22. },23. { field: "CurrentAmount.Amount", title: "Current Amount" },24. { command: ["edit", "destroy"], title: " ", width: "110px" },25. ],26. editable: "popup",27. };KendoFitlerSchema
01.schema: {02. model: {03. id: "Id",04. fields: {05. Id: { type: "number", editable: false },06. Name: { type: "string" },07. }08. }09.},ResponseBody odata
01.{02. "@odata.context": "https://localhost/Awvn.Admin.Api/odata/$metadata#EmployeeBudgets",03. "value": [04. {05. "Id": 4,06. "CreatedDate": "2017-03-29T08:27:07.17+02:00",07. "CreatedBy": "EmployeeBudgetsInitializer",08. "LastModifiedDate": "2017-03-29T08:27:07.17+02:00",09. "LastModifiedBy": "EmployeeBudgetsInitializer",10. "Description": null,11. "StartDate": "2000-01-01T00:00:00+01:00",12. "EndDate": "2100-01-01T00:00:00+01:00",13. "EmployeeId": 4162,14. "EmployerBudgetId": 3,15. "InitialAmount": {16. "Amount": 0,17. "Currency": "EUR"18. },19. "CurrentAmount": {20. "Amount": 0,21. "Currency": "EUR"22. },23. "Employee": {24. "Id": 4162,25. "IsDeleted": false,26. "Email": "Rick75@import.nl",27. "LocalFunctionGroup": "Automotive",28. "FunctionGroupId": 2,29. "UserId": null,30. "EmployerId": 2,31. "FunctionGroup": {32. "Id": 2,33. "Name": "Accounting / Financieel" <- The field I want to use for my filtering34. }35. }36. }37. ]38.}
Kendo UI version: "2017.1.223"
Chrome Version 56.0.2924.87
As far as I can see (http://docs.telerik.com/kendo-ui/api/javascript/drawing/tooltip-options#fields-content) I can only really provide a text string to the .drawingElement.options.tooltip (or a function that returns a text string). If the string is a uri then the tooltip actually tuns into a iFrame with whatever content you want as delivered by the uri.
What I would like to do is to be able to use a function that returns a DOM element (a div containing data laid out in a non trivial way). Can this be done? if so how? If not do I have any other choice than to use the uri and iFrame mechamism?
Also: is there any documentation anywhere that describes the properties and methods (if any) associated with the parameter that is passed to 'function' version of the tooltip content?
Regards
Alan
<script type="text/x-kendo-template" id="insertVideo-template"> <div> <label for="videoUrl">Enter a Share URL from YouTube:</label> <input type="text" id="videoUrl" name="videoUrl"/> <div class="insertVideo-actions"> <button class="k-button insertVideo-insert">Insert</button> <button class="k-button insertVideo-cancel">Cancel</button> </div> </div></script><script type="text/x-kendo-template" id="youTube-template"> <iframe width="458" height="315" src="http://www.youtube.com/embed/#= source #?wmode=opaque&rel=0" frameborder="0"></iframe></script>function insertVideo(e) { var editor = $(this).data("kendoEditor"); var dialog = $($("#insertVideo-template").html()) .find(".insertVideo-insert") .click(function() { var media = testUrlForMedia(dialog.element.find("input").val()); if (media) { var template = kendo.template($("#youTube-template").html()); editor.exec("insertHtml", { value: template({ source: media.id }) }); } dialog.close(); }) .end() .find(".insertVideo-cancel") .click(function() { dialog.close(); }) .end() .kendoWindow({ modal: true, title: "Insert Video", animation: false, deactivate: function() { dialog.destroy(); } }).data("kendoWindow"); dialog.center().open();}// Check inserted URL for valid Media Linkfunction testUrlForMedia(pastedData) { var success = false; var media = {}; if (pastedData.match('http://(www.)?youtube|youtu\.be')) { if (pastedData.match('embed')) { youtube_id = pastedData.split(/embed\//)[1].split('"')[0]; } else { youtube_id = pastedData.split(/v\/|v=|youtu\.be\//)[1].split(/[?&]/)[0]; } media.type = "youtube"; media.id = youtube_id; success = true; } if (success) { return media; } else { alert("No valid media id detected.\nBe sure to use the \"Share\" url, located in the menu under the video on the youtube page."); } return false;}$(".fnRichTextField").kendoEditor({ encoded: false, tools: [ "bold", "italic", "underline", "separator", "fontName", "fontSize", "foreColor", "backColor", "separator", "insertUnorderedList", "insertOrderedList", "separator", "justifyLeft", "justifyCenter", "justifyRight", "justifyFull", "separator", "createLink", "unlink", "separator", { name: "insertVideo", tooltip: "Embed Youtube Video", exec: insertVideo }, "viewHtml" ]});
We allow our users to define masked fields that then appear in a kendo grid. I've seen the example (http://www.telerik.com/forums/masked-column-in-a-grid) that recommends using a JavaScript function to format the value, but how would that work with unknown mask formats?
Furthermore, I'm not interested in allowing users to edit the value, just to display the value such that if the unformatted string value is 123456789 and the mask is ###-##-####, it would appear in the grid as "123-45-6789". How can this be accomplished on the fly?