Hello,
It is not intuitive for my users to enter 35% as "0.35" the way the control expects it. Is there a way to override this format?
I can see from the generated source that there is a "k-format" CssClass applied to this field. Maybe this is a clue for possible override?
Thanks in advance for any help!
5 Answers, 1 is accepted
Such behavior is not included in the current functionality of the Ajax RadGantt control. Yet one possible solution may be to use Kendo Gantt control and use an editable template.
Regards,
Plamen
Telerik
Rank 1
Thank you Plamen,
I'm trying your recommendation with Keno Gantt. I have the following template and the general idea is to have a hidden control bound to the percentComplete property. My input happens in a visible text box and I would like to place the result/100 in the hidden control as follows:
<html ng-app><head> <meta charset="utf-8"/> <title>Kendo UI Snippet</title> <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.1.112/styles/kendo.common.min.css"/> <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.1.112/styles/kendo.rtl.min.css"/> <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.1.112/styles/kendo.silver.min.css"/> <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.1.112/styles/kendo.mobile.all.min.css"/><script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script> <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <script src="http://kendo.cdn.telerik.com/2016.1.112/js/kendo.all.min.js"></script></head><body> script id="editor" type="text/x-kendo-template"> <h3>Edit meeting</h3> <p> <label>Title: <input name="title" /></label> </p> <p> <label>Start: <input data-role="datetimepicker" name="start" /></label> </p> <p> <label>End: <input data-role="datetimepicker" name="end" /></label> </p> <p> <input id="tgt" type="hidden" name="percentComplete" /> <input type="text" onkeyup='$("tgt")[0].value = this.value' /> </p></script><div id="gantt"></div><script>$("#gantt").kendoGantt({ dataSource: [ { id: 1, orderId: 0, parentId: null, title: "Task1", start: new Date("2014/6/17 9:00"), end: new Date("2014/6/17 11:00"), percentComplete: 0.4 } ], editable: { template: $("#editor").html() }});</script></body></html>But whenever I add the onkeyup code, the editor does not appear anymore.
Any ideas?
You can use the edit event of Gantt control to add the click event to the input.
Here is the dojo page that worked correctly at my side.
Regards,
Plamen
Telerik
Rank 1
Plamen,
Focusing on my original problem, I wish to enable the user to type Percentage Complete as an integer, ie. 45% as opposed to 0.45.
Although I was successful in implementing a custom template in KendoGantt in sample project, it does not seem trivial to simply plug in the Kendo version in place of RadGantt. Would you say I'm correct in that assumption? In other words, how I populate my RadGantt from the database does not seem compatible with KendoGantt which seems to require some WebService methods.
Also the Kendo controls seem to be following a completely different model via MVC, does not seem to have the same "code behind" apsx.cs functionality.
I don't plan on converting my entire application to accommodate this. Are you sure there's not some other way I can override the default behavior of the PercentComplete field in the task editor?
Thanks.
Unfortunately the behavior is not included in the current functionality of the Ajax RadGantt control. Please excuse us for this limitation of the control Yet you can refer to the documentation about how Kendo widgets can be used in ASP .NET WebForms. Here are some articled that can be helpful:
http://docs.telerik.com/kendo-ui/third-party/tutorials/webforms/asp-net-hello-jquery
http://docs.telerik.com/kendo-ui/third-party/tutorials/webforms/asp-net-hello-services
http://docs.telerik.com/kendo-ui/third-party/tutorials/webforms/asp-net-hello-kendo-ui-part-2
Hope this information will be helpful.
Regards,
Plamen
Telerik