Is it possible to access the data of a column/field in a template like a row template in a razor template?
for instance : <li><label>Parent Test :</label> <strong>#= ParentTest #</strong></li>
@{
// How would I get the value of this var?
var parentTest = ?
}
Thanks
First of all, someone should review the code in these forums so that if a user hits the backspace key when creating a new post the page does not navigate back! So this is my second attempt to post this question because my first 95% complete post was vaporized when I hit the backspace key. [arg!]
I am basing the code from this documentation:
http://docs.telerik.com/kendo-ui/controls/editors/editor/overview
I have a razor form with two editors on them and am formatting them as in the link above but they are showing up as read only. Also the data from the model is not populating the control. I tried using a standard input control as well with the same results.
Here is the code:
<p> @Html.TextAreaFor(m => m.Test.IntroText, new {style = "width:591px", id = "introtext"})</p>I tried removing the style attribute above with no change.
Here is the JavaScript:
$("#thankyoutext").kendoEditor({ resizable: { content: true, toolbar: true, editable : true <<-- Just tried that does not change anything }, tools: [ "bold", "italic", "underline", "strikethrough", "justifyLeft", "justifyCenter", "justifyRight", "justifyFull", "insertUnorderedList", "insertOrderedList", "indent", "outdent", "createLink", "unlink", "insertImage", "insertFile", "subscript", "superscript", "createTable", "addRowAbove", "addRowBelow", "addColumnLeft", "addColumnRight", "deleteRow", "deleteColumn", "viewHtml", "formatting", "cleanFormatting", "fontName", "fontSize", "foreColor", "backColor", "print" ]});var editor = $("#thankyoutext").data("kendoEditor"),editorBody = $(editor.body);editorBody.attr("contenteditable", true).find("a").off("click.readonly");
Can someone help explain why it is greyed, read-only and does not contain data from the model?
Reid
I am looking for a way to hide either the toolbar or the buttons with in it. I am using angular with the batch editing and when I disenable the grid I want to be able to be able to either hid or disable the batch toolbar.
I have found example like this that work for MVC or JS approaches, using the databound function,
http://www.telerik.com/forums/how-do-you-remove-toolbar-separators
I have also tried doing it this way, while it does find the element, there are no valid methods or properties
var elements = document.getElementsByClassName("k-grid-toolbar");
while (elements.length > 0) {
elements[0].parentNode.removeChild(elements[0]);
}I have a grid showing a set of records with a configuration of "editable: "popup" that is working to display the records. The popup shows the row data but when I click the "update" button the popup goes away but the associated controller action does not get called.
I am following along with these links:
http://demos.telerik.com/kendo-ui/grid/editing-popup
http://docs.telerik.com/kendo-ui/controls/data-management/grid/editing
My code is the same :
$(document) .ready(function() { dataSource = new kendo.data.DataSource({ transport: { read: { url: "/Test/TestsAnswerTypesRead", dataType: "jsonp" }, update: { url: "/Test/UpdateTestAnswerType", dataType: "jsonp" }, destroy: { url: "/Test/DestroyTestAnswerType", dataType: "jsonp" }, create: { url: "/Test/CreateTestAnswerType", dataType: "jsonp" }, parameterMap: function(options, operation) { if (operation !== "read" && options.models) { return { models: kendo.stringify(options.models) }; } } }, batch: true, pageSize: 20, schema: { model: { id: "Id", fields: { Id: { editable: false, nullable: true }, Name: { validation: { required: true } }, Description: {}, Instruction: {} } } } }); $("#grid") .kendoGrid({ dataSource: dataSource, pageable: { refresh: true, pageSizes: true, buttonCount: 8 }, groupable: true, scrollable: true, sortable: true, filterable: true, resizable: true, reorderable: true, height: 550, toolbar: ["create", "excel"], excel: { fileName: "TestsExport.xlsx", proxyURL: "/ExportTestDomain", filterable: true }, columns: [ { field: "Name", title: "Name", width: "150px" }, { field: "Description", title: "Description", width: "150px" }, { field: "Instruction", title: "Instruction", width: "150px" }, { command: ["edit", "destroy"], title: " ", width: "150px" } ], editable: "popup" });});
Here is the Controller action for the Update :
public JsonResult UpdateTestAnswerType(){ var models = this.DeserializeObject<IEnumerable<NCC.Model.DTO.TestAnswerType>>("models"); if (models != null) { // Update Here } return this.Jsonp(models);}And I tried this format:
[AcceptVerbs(HttpVerbs.Post)]public JsonResult UpdateTestAnswerType([DataSourceRequest] DataSourceRequest request, [Bind(Prefix = "models")] IEnumerable<NCC.Model.DTO.TestAnswerType> gridtestAnswerTypess){ var models = this.DeserializeObject<IEnumerable<NCC.Model.DTO.TestAnswerType>>("models"); if (models != null) { // Update Here } return this.Jsonp(models);}When I click the "add new record" button on the toolbar and post that it does the same, closes with no post to the controller.
Also, how can you make the popup dialog for an insert say, "Adding new record" instead of "Edit", and the dialog's update button say, "Save"?
Any help would be greatly appreciated.
Thanks,
Reid
Hi,
I'm having trouble replicating the demo for the calendar in angular - Customizing Templates http://demos.telerik.com/kendo-ui/calendar/template
I want to be able to pass it a list of dates from a scope variable and have the dates shown on the calendar with a different style from a template.
I would also like to be able to update the list of dates after the widget has been initialized. Is this possible with the calendar and angular?
I've tried setting the 'month' and 'dates' attributes in markup to my scope variable but it's not working.

I'm super excited that Telerik made the jump over to npm for Kendo UI Professional. It works wonderfully! But ...
Is there some particular reason why the *.min.js files were just removed? Those were very useful in optimizing the output. The way it is now, we've got to add minification to kendo to the entire process on top of everything else.
Is there a CSS definition file/page or a list of all CSS per element or something along those lines?
I am attempting to figure out how hard/easy it is going to be to integrate a theme/styling into an app. But I am not even sure what the styles are I should use. Every thing on a page is not going to be a Kendo widget - but everything should look the same.
For instance, if I want to style a table to look like a grid would like using the widget, but without all the overhead - how do I do that?
If I want all links to match - do I really have to use k-link on all <a>s? That's a little crazy.
A definition file would help me determine if it's doable and determine how easy to use the cascading part of CSS without have to add a class to every single element added to a page.
Hi
I use a chart Kendo UI, (using typescript). I have a problem with the tooltip
formatting and the same problem with the label (on series).
I have a formatted value (as string, but not the format type)
and I want to replace the original value with that.
Is it possible to replace
the value? then how?
*** Must say I have seen the example chartTooltip.html
another question , I’ve
tried to replace the value with escape char “\”, Before any character I've
“\\\\”, which is the result.
result : see (kendo chart.png)
------------------------------------------------------------------------
i tried to do that also
namespace prefix.html.chart
{
export class chart
{
public formatnewABC(v: any, vf: any): any
{
return (vf);
}
...
...
// build chart source code
// this.ser - current series object properties
var vf: string = this.data.getFormattedValue(i, j); // contains format value (string)
this.ser["labels"] = {
visible: true,
template: "#= prefix.html.chart.PnChart.prototype.formatnewABC(dataItem," + "\"" + vf + "\"" + " ) #"
};
}
}
result : see (kendo chart2.png)
Thanks in advance for your help
