I'm using a variation on the code from this article to export master and child grids into a single Excel worksheet. I've got the data exporting correctly, but there are two date fields that are showing up in the JSON date format - /Date(1498107600000)/. I'm having trouble finding any documentation on how to correct this. I've tried the following:
var exporter = new kendo.ExcelExporter({ columns: [{ field: "Name" }, { field: "Result" }, { field: "DateCompleted", title: "Date Completed", format: "dd/MM/yyyy" }, { field: "DateReceived", title: "Date Received", format: "dd/MM/yyyy" }], dataSource: dataSource });
Where is this breaking down?
$("#groups-no-dropdown").kendoComboBox({ filter: "contains", ignoreCase: true, dataTextField: "Name", dataValueField: "Id", minLength: 3, enforceMinLength: true, footerTemplate: 'Total #: instance.dataSource.total() # items found', template: '<span class="k-state-default"><h3>#: data.Name #</h3><p>#: data.Id #</p></span>', placeholder: "Enter a Group Name...", filtering: function(e) { console.log(e); }, dataSource: { transport: { read: { dataType: "json", url: '@Url.Action("GetData", "Groups")', type: "POST" } }, parameterMap: function (data, type) { console.log(data); data = kendo.stringify({ request: { filter: data.filter.field + "~" + data.filter.operator + "~'" + data.filter.value + "'" } }); console.log(data); return data; }, serverFiltering: true, schema: { type: "json", data: "Data", total: "Total", model: { fields: { Id: { field: "Id", type: "guid" }, Name: { field: "Name", type: "string" } } } }, sort: { field: "Name", dir: "asc" } }, height: 400 });ue
The above is my combobox. You can see parameter map, but regardless if I remove parameter map or not. The data gets posted as:
filter[logic]:and
filter[filters][0][value]:eng
filter[filters][0][field]:Name
filter[filters][0][operator]:contains
filter[filters][0][ignoreCase]:true
Also why is the posted data different from data in the parameter map function? It seems like additional processing is happening. Here is what is spit out to console inside parameterMap function:
{filter: {…}, sender: init, _defaultPrevented: false, preventDefault: ƒ, isDefaultPrevented: ƒ}filter:{value: "eng", field: "Name", operator: "contains", ignoreCase: true}isDefaultPrevented:ƒ ()preventDefault:ƒ ()sender:init {ns: ".kendoComboBox", element: I.fn.init(1), _events: {…}, options: {…}, _isSelect: false, …}_defaultPrevented:false__proto__: ObjectWhich is structured differently than what is being posted.
Any of the Kendo elements on the page that we implement are displaying lower than they should. The elements should be displaying just below the input, but, at times, the element is displaying almost entirely off of the bottom of the page.
I am wondering if anyone else has ran into this and knows of a solution.
Thanks!
Hi Masters,
How can I set enforceMinLength = true from Angular html models?
It doesn't look like it's working like this:
<input kendo-auto-complete ng-model="customerName" k-min-length="3" enforceMinLength="true" k-data-source="repos" style="width: 100%;" />
Hi,
Here is my editor markup -
<text-editor params="model: organisationChart, root: $root"><div> <div data-bind="css: notesContainerClass, if: label" class="notes_label"></div> <div data-bind="css: containerClass" class="rtb_container"> <table cellspacing="4" cellpadding="0" class="k-widget k-editor k-header k-editor-widget" role="presentation"><tbody><tr role="presentation"><td class="k-editor-toolbar-wrap" role="presentation"><ul class="k-editor-toolbar" role="toolbar" data-role="editortoolbar"><li class="k-tool-group k-button-group" role="presentation"><a href="" role="button" class="k-tool k-group-start" unselectable="on" title="Bold" aria-pressed="false"><span unselectable="on" class="k-tool-icon k-bold">Bold</span></a><a href="" role="button" class="k-tool" unselectable="on" title="Italic" aria-pressed="false"><span unselectable="on" class="k-tool-icon k-italic">Italic</span></a><a href="" role="button" class="k-tool" unselectable="on" title="Underline" aria-pressed="false"><span unselectable="on" class="k-tool-icon k-underline">Underline</span></a><a href="" role="button" class="k-tool k-group-end" unselectable="on" title="Strikethrough" aria-pressed="false"><span unselectable="on" class="k-tool-icon k-strikethrough">Strikethrough</span></a></li><li class="k-tool-group k-button-group" role="presentation"><a href="" role="button" class="k-tool k-group-start" unselectable="on" title="Align text left" aria-pressed="false"><span unselectable="on" class="k-tool-icon k-justifyLeft">Justify Left</span></a><a href="" role="button" class="k-tool" unselectable="on" title="Center text" aria-pressed="false"><span unselectable="on" class="k-tool-icon k-justifyCenter">Justify Center</span></a><a href="" role="button" class="k-tool" unselectable="on" title="Align text right" aria-pressed="false"><span unselectable="on" class="k-tool-icon k-justifyRight">Justify Right</span></a><a href="" role="button" class="k-tool k-group-end" unselectable="on" title="Justify" aria-pressed="false"><span unselectable="on" class="k-tool-icon k-justifyFull">Justify Full</span></a></li><li class="k-tool-group k-button-group" role="presentation"><a href="" role="button" class="k-tool k-group-start" unselectable="on" title="Insert unordered list" aria-pressed="false"><span unselectable="on" class="k-tool-icon k-insertUnorderedList">Insert unordered list</span></a><a href="" role="button" class="k-tool" unselectable="on" title="Insert ordered list" aria-pressed="false"><span unselectable="on" class="k-tool-icon k-insertOrderedList">Insert ordered list</span></a><a href="" role="button" class="k-tool k-group-end" unselectable="on" title="Indent"><span unselectable="on" class="k-tool-icon k-indent">Indent</span></a><a href="" role="button" class="k-tool k-group-end k-state-disabled" unselectable="on" title="Outdent" style="display: none;"><span unselectable="on" class="k-tool-icon k-outdent">Outdent</span></a></li><li class="k-tool-group k-button-group" role="presentation"><a href="" role="button" class="k-tool k-group-start" unselectable="on" title="Insert hyperlink"><span unselectable="on" class="k-tool-icon k-createLink">Create Link</span></a><a href="" role="button" class="k-tool k-state-disabled" unselectable="on" title="Remove hyperlink" style="display: none;"><span unselectable="on" class="k-tool-icon k-unlink">Remove Link</span></a><a href="" role="button" class="k-tool k-group-end" unselectable="on" title="Insert image"><span unselectable="on" class="k-tool-icon k-insertImage">Insert Image</span></a></li><li class="k-tool-group k-button-group" role="presentation"><a href="" role="button" class="k-tool k-group-start" unselectable="on" title="Subscript" aria-pressed="false"><span unselectable="on" class="k-tool-icon k-subscript">Subscript</span></a><a href="" role="button" class="k-tool k-group-end" unselectable="on" title="Superscript" aria-pressed="false"><span unselectable="on" class="k-tool-icon k-superscript">Superscript</span></a></li><li class="k-tool-group k-button-group" role="presentation"><a href="" role="button" class="k-tool k-group-start k-group-end" data-popup="" unselectable="on" title="Create table"><span unselectable="on" class="k-tool-icon k-createTable">Create table</span></a><a href="" role="button" class="k-tool k-state-disabled" unselectable="on" title="Add row above" style="display: none;"><span unselectable="on" class="k-tool-icon k-addRowAbove">Add row above</span></a><a href="" role="button" class="k-tool k-state-disabled" unselectable="on" title="Add row below" style="display: none;"><span unselectable="on" class="k-tool-icon k-addRowBelow">Add row below</span></a><a href="" role="button" class="k-tool k-state-disabled" unselectable="on" title="Add column on the left" style="display: none;"><span unselectable="on" class="k-tool-icon k-addColumnLeft">Add column on the left</span></a><a href="" role="button" class="k-tool k-state-disabled" unselectable="on" title="Add column on the right" style="display: none;"><span unselectable="on" class="k-tool-icon k-addColumnRight">Add column on the right</span></a><a href="" role="button" class="k-tool k-state-disabled" unselectable="on" title="Delete row" style="display: none;"><span unselectable="on" class="k-tool-icon k-deleteRow">Delete row</span></a><a href="" role="button" class="k-tool k-group-end k-state-disabled" unselectable="on" title="Delete column" style="display: none;"><span unselectable="on" class="k-tool-icon k-deleteColumn">Delete column</span></a></li><li class="k-tool-group k-button-group" role="presentation"><a href="" role="button" class="k-tool k-group-start k-group-end" unselectable="on" title="View HTML"><span unselectable="on" class="k-tool-icon k-viewHtml">View HTML</span></a></li><li class="k-tool-group" role="presentation"><span class="k-editor-dropdown k-group-start k-group-end"><span class="k-widget k-dropdown k-header k-editor-widget" unselectable="on" role="listbox" aria-haspopup="true" aria-expanded="false" tabindex="0" aria-owns="" aria-disabled="false" aria-readonly="false" aria-busy="false" style="width: 110px;"><span unselectable="on" class="k-dropdown-wrap k-state-default"><span unselectable="on" class="k-input">Format</span><span unselectable="on" class="k-select"><span unselectable="on" class="k-icon k-i-arrow-s">select</span></span></span><select title="Format" class="k-formatting k-decorated" data-role="selectbox" unselectable="on" style="width: 110px; display: none;"><option value="p" selected="selected">Paragraph</option><option value="blockquote">Quotation</option><option value="h1">Heading 1</option><option value="h2">Heading 2</option><option value="h3">Heading 3</option><option value="h4">Heading 4</option><option value="h5">Heading 5</option><option value="h6">Heading 6</option></select></span></span></li><li class="k-tool-group k-button-group" role="presentation"><a href="" role="button" class="k-tool k-group-start k-group-end" unselectable="on" title="Clean formatting"><span unselectable="on" class="k-tool-icon k-cleanFormatting">Clean formatting</span></a></li><li class="k-tool-group" role="presentation"><span class="k-widget k-combobox k-header k-group-start k-editor-widget" unselectable="on" style=""><span tabindex="-1" unselectable="on" class="k-dropdown-wrap k-state-default"><input class="k-input k-fontName k-group-start" type="text" autocomplete="off" role="combobox" aria-expanded="false" tabindex="0" aria-disabled="false" aria-readonly="false" aria-autocomplete="list" aria-owns="" aria-busy="false" unselectable="on" style="width: 100%;"><span tabindex="-1" unselectable="on" class="k-select"><span unselectable="on" class="k-icon k-i-arrow-s" role="button" tabindex="-1">select</span></span></span><select title="Font Name" class="k-fontName k-group-start" data-role="combobox" aria-disabled="false" aria-readonly="false" unselectable="on" style="display: none;"><option value="inherit" unselectable="on" selected="selected">(inherited font)</option><option value="Arial,Helvetica,sans-serif" unselectable="on">Arial</option><option value="'Courier New',Courier,monospace" unselectable="on">Courier New</option><option value="Georgia,serif" unselectable="on">Georgia</option><option value="Impact,Charcoal,sans-serif" unselectable="on">Impact</option><option value="'Lucida Console',Monaco,monospace" unselectable="on">Lucida Console</option><option value="Tahoma,Geneva,sans-serif" unselectable="on">Tahoma</option><option value="'Times New Roman',Times,serif" unselectable="on">Times New Roman</option><option value="'Trebuchet MS',Helvetica,sans-serif" unselectable="on">Trebuchet MS</option><option value="Verdana,Geneva,sans-serif" unselectable="on">Verdana</option><option unselectable="on"></option></select></span><span class="k-widget k-combobox k-header k-editor-widget" unselectable="on" style=""><span tabindex="-1" unselectable="on" class="k-dropdown-wrap k-state-default"><input class="k-input k-fontSize" type="text" autocomplete="off" role="combobox" aria-expanded="false" tabindex="0" aria-disabled="false" aria-readonly="false" aria-autocomplete="list" aria-owns="" aria-busy="false" unselectable="on" style="width: 100%;"><span tabindex="-1" unselectable="on" class="k-select"><span unselectable="on" class="k-icon k-i-arrow-s" role="button" tabindex="-1">select</span></span></span><select title="Font Size" class="k-fontSize" data-role="combobox" aria-disabled="false" aria-readonly="false" unselectable="on" style="display: none;"><option value="inherit" unselectable="on" selected="selected">(inherited size)</option><option value="xx-small" unselectable="on">1 (8pt)</option><option value="x-small" unselectable="on">2 (10pt)</option><option value="small" unselectable="on">3 (12pt)</option><option value="medium" unselectable="on">4 (14pt)</option><option value="large" unselectable="on">5 (18pt)</option><option value="x-large" unselectable="on">6 (24pt)</option><option value="xx-large" unselectable="on">7 (36pt)</option><option unselectable="on"></option></select></span><div class="k-colorpicker k-foreColor" data-role="colorpicker" style=""></div><span role="textbox" aria-haspopup="true" class="k-widget k-colorpicker k-header k-editor-widget" aria-disabled="false" tabindex="0" aria-label="Current selected color is #000000" title="Color" unselectable="on" aria-owns="866d753e-1f0e-4da6-95ea-ea62eef36947"><span class="k-picker-wrap k-state-default" unselectable="on"><span class="k-tool-icon k-foreColor" unselectable="on"><span class="k-selected-color" unselectable="on" style="background-color: rgb(0, 0, 0);"></span></span><span class="k-select" unselectable="on"><span class="k-icon k-i-arrow-s" unselectable="on"></span></span></span></span><div class="k-colorpicker k-backColor" data-role="colorpicker" style=""></div><span role="textbox" aria-haspopup="true" class="k-widget k-colorpicker k-header k-editor-widget k-group-end" aria-disabled="false" tabindex="0" aria-label="Current selected color is #000000" title="Background color" unselectable="on" aria-owns="99cc64c1-d1dd-4101-8b9d-709bb8a6bf56"><span class="k-picker-wrap k-state-default" unselectable="on"><span class="k-tool-icon k-backColor" unselectable="on"><span class="k-selected-color" unselectable="on" style="background-color: rgb(0, 0, 0);"></span></span><span class="k-select" unselectable="on"><span class="k-icon k-i-arrow-s" unselectable="on"></span></span></span></span></li></ul></td></tr><tr><td class="k-editable-area"><iframe frameborder="0" class="k-content" src='javascript:""'></iframe><textarea data-bind="htmlEditor: model.note" data-role="editor" autocomplete="off" class="k-content k-raw-content" style="display: none;"></textarea></td></tr></tbody></table> </div> <div class="notes_buttons"> <div> <img class="attachment_image" data-bind="click: upload, attr: { src: attachmentImageSource, title: attachmentsAddAttachementTooltip }" src="/images/clip.png" title="Upload attachment"> <input type="file" name="files" class="hidden file-upload" data-bind="attachmentFileUploader: true, model: $component, attr: { 'data-url': uploadUrl, id: fileInputName }" multiple="" value="+" data-url="/Plan/Save?planId=580&type=OrganisationChart" id="OrganisationChart_Input"> </div> </div> <div class="attachments"> <!-- ko if: model.attachments().length > 0 --><!-- /ko --> </div> <wait-timer-dialog params="showMessage: showWaitTimer, message: waitMessage"><div class="popup hidden" data-bind="waitTimerDialog: showMessage, model: $data"> <div data-bind="text: message"></div> <img data-bind="attr: { src: imageUrl }" src="/images/loader-green.gif"> </div></wait-timer-dialog> <wait-timer-dialog params="showMessage: showDeleteAttachmentTimer, message: deleteAttachmentMessage"><div class="popup hidden" data-bind="waitTimerDialog: showMessage, model: $data"> <div data-bind="text: message">Deleting attachment. Please wait...</div> <img data-bind="attr: { src: imageUrl }" src="/images/loader-green.gif"> </div></wait-timer-dialog> <message-dialog params="showMessage: success, message: uploadSuccess"><div class="popup hidden" data-bind="messageDialog: showMessage, model: $component"> <div data-bind="text: displayMessage">Attachment(s) uploaded successfully.</div> </div></message-dialog> <message-dialog params="showMessage: deleteSuccess, message: deleteSuccessMessage"><div class="popup hidden" data-bind="messageDialog: showMessage, model: $component"> <div data-bind="text: displayMessage">Attachment(s) deleted successfully.</div> </div></message-dialog> <message-dialog params="showMessage: error, isError: true, message: errorMessage"><div class="popup hidden" data-bind="messageDialog: showMessage, model: $component"> <div data-bind="text: displayMessage">Error occurred. Please try again.</div> </div></message-dialog></div></text-editor>
I want to disable this based on a value in my knockout viewmodel.
From research, it appears as tho it needs to be done once the page is fully rendered, so Im trying to do so in document.ready(), without success.
I've tried to find the control in a number of ways, no of which work -
var editor = $('#OrganisationChart').data('kendoEditor'); if (editor != undefined) { alert("organisationChart Editor found"); editor.body.contentEditable = false; } $('.k-editor textarea').each(function (idx, element) { alert("Editors found"); $($(element).data("htmlEditor").body).attr("contenteditable", false); });
Can you help me in how to identify these editors so I disable them please?
Thank you,
Terry.
Hi,
Is there an easy way to copy a record and then start the edit for this record in one go?
During the copy some data might be changed before the record is added and edited.
I have setup a sample script here:
http://dojo.telerik.com/@Insad/epERa
But I don't know how to go from there.
What I have done is take a simple grid, added a custom button in the command column and attached the click to a function inside my viewModel.
Here I can get the current dataItem, change the ProductName, set the ProductID to null and add it to the datasource and force a refresh of the grid.
But what happens is that the original item in the grid has the changed ProductName in it and a new record is added at the very end of the grid, without a ProductID.
How I get the edit started is also not known to me at this time.
Is there another way? Is there a sample for this somewhere (didn't find anything in the forum or with Google)?
Best regards,
Insad

I would disable value insertion in the MaskedTextBox, but keep the validator for that field.
I use kendo with MVVM.
This is my html code:
<div>
<label for="elem" class="elem">Field</label>
<input data-role="maskedtextbox" data-bind="value: elem1" id="elem" name="element" class="form-control" placeholder="Insert" required validationMessage="Insert {0}" disabled/>
<span class="k-invalid-msg" data-for="element"></span>
</div>

Hi I am pretty new to using kendo so I might have missed something pretty simple here. I would like to create a treelist where the expand option is in the 3rd column and I cannot find anyway to do this. This is a fairly common design and can be found in the call tree option of in the performance data of most modern browsers. I have attached an image from chrome to demonstrate the style I would like to implement.

Hi,
I'm working on kendo scheduler : http://dojo.telerik.com/@n2lose/ogUzay/2
1. Is there any way to set selected local timezone on the dialog add event? I would like to set local timezone selected when open dialog instead of user has to be selected from drop down list timezone!
I have researched and found the way to set timezone by the way set defaultValue for startTimezone, endTimezone. But normally, i just can get the timezoneOffset (number), how can i get the label timezone as we select an item in drop down list timezone?
2. When user selected an item from resources dataSource, can we custom template to add a link of that item below the drop down list? i mean i can custom template when handle on resources dataSource?
In Kendo UI MVC, you can use one action for all your data widgets (grid, combobox, etc.) and filtering is handled the same. However, when I try to use a kendo-ui JS widget to hit that same action, it passes the filtering differently. Why is that? How can I bridge that gap?
If you use MVC Combobox and post to action, the filtering gets sent as:
sort: Name-asc
page: 1
pageSize: 80
group:
filter: Name~contains~'manager'
If you use the JS Combobox and post to action, its sent as:
filter[logic]: and
filter[filters][0][value]: manager
filter[filters][0][field]: Name
filter[filters][0][operator]: contains
filter[filters][0][ignoreCase]: true
Because of this different structure, my action with signature:
public IActionResult QueryEntities([DataSourceRequest] DataSourceRequest request)
The request.Filters is always empty. How can I convert the js filter for combobox so my action can recognize it? And why are they handled differently anyway? I thought MVC version just wraps the JS version and generates the JS from server side code.