Note: This is a duplicate of http://www.telerik.com/forums/editable-grid-with-angular---update-not-working as I am not sure wheter this is a problem of the DataSource configuration or the grid configuration (or both).

I am using a kendo-ui grid together with angular and would like to
use it's edit functionality. However the update function is never called
when trying to edit its contents.

This is how I set the grid:



Here is a fiddle to demonstrate it: http://jsfiddle.net/xLp6rLtj/

Even if I'm using a url instead of function in the
datasource.transport.update parameter, no request is made (and the
button can't be released).

What am I missing?

Hi

I have following example (modified original demo from Kendo Scheduler):

http://dojo.telerik.com/AkIGO

In this example I create a data array with two events which are displayed properly on the scheduler view on the right side.

    var data = [{ TaskID: 0, OwnerID: 1, Title: "Bowling tournament 6", Start: "2013-06-10T10:30:00", End: "2013-06-10T11:30:00", IsAllDay: false},{ TaskID: 1, OwnerID: 2, Title: "Golf", Start: "2013-06-11T10:30:00", End: "2013-06-11T11:30:00", IsAllDay: false}];

I have included a button, which event I catch and then extend this "data" array with one more element like this:

    data.push({ TaskID: 2, OwnerID: 3, Title: "New Event", Start: "2013-06-12T10:30:00", End: "2013-06-12T11:30:00", IsAllDay: false});
    console.log(data);

The console.log of the array confirms the addition. I hence call the following refresh code:

$("#scheduler").data("kendoScheduler").refresh();

...which does not update my scheduler view on the right to include the new event (created for wednesday 6/12).

I have also tried:

    $('#scheduler').data('kendoScheduler').dataSource.read();

but this results in an error.

Any ideas?

Hello, when I try to create new task I get "Out of stack space" exception.
Link with the example. Version of Kendo UI: 2014.3.1411.

What can be the reason of this exception?

Hi Guys

An annoying feature of the grid is that any Update/Cancel/Destroy buttons, within the grid or edit popups, are draggable by the mouse and can be dropped onto edit fields resulting in the underlying html code being inserted into the text box.

To me this behaviour feels wrong for buttons.

Is there an easier way to stop the buttons being draggable by default, without traversing the DOM and setting draggable="false" on every k-button <a> element.

Regards
Alan

Hello,

Is there any option to set some kind of line 'border'?
Here is situation:
I have white background. And if I set white color for chart - obviously I will see nothing there :D

So that why I'm asking if there any line border property.

I found one way: to draw another line(more width and another color) under original one.
But seems to be not proper way, but it will still work.

Thanks,
Vlad.

When ever I put a custom font icon in the tab strip it raises the height of the tab strip. The extra height (blank space above teh icon) is equivalent to the space reserved for the icon.  When I look at the code in dreamweaver I can see a grey square for where the Icons are meant to go and when the custom icon is inserted this grey box is place above the custom icon and the whole tab space is raised.  I tried all types of css  but is keeps on reserving this space for the kendo icon and will not give up the space when a custom font icon is inserted.


<footer data-role="footer">
    <div data-role="tabstrip" style="background-color:#F96;font-size:small">
      <a onclick="noImg();" data-icon="favourites">None</a>
      <a onclick="medImg();" data-icon="compose" >Med</a>
      <a onclick="lgImg();" data-icon="globe">Large</a>
     <a href="views/insect.html" class="tabIcon"><i class="icon-kub-mobile" style="font-size:xx-large"></i><div>All hhh</div></a>
     </div>
  </footer>


Also when I have many buttons in the tabstrip each button has too much padding/margins and I would like them to be able to become even more narrower than default. How do I do this?

We have a listview that uses a template, but the nature of the data displayed in the template means that the listview items can be of variable height.  We're running into an issue with the listview layout when this happens.  Please see the attached image.

Is there something we can do to prevent this from happening and keep the elements displaying in rows with their top edges aligned?

Thank you!

Hi~ 

I have trouble in editing treeview node when I set up dragAndDrop option true.

I changed dragAndDrop options false, it worked.

Here is my code....

I'm using angularjs.
===========================================================
html file
--------------------------------------------------------------------------------------------------------------
<div kendo-tree-view="tree" k-options="option1" id="treeView"></div>

<!--  treeview template -->
<script id="treeview-template" type="text/kendo-ui-template">
           <a ng-click="edit($event)" ><span>#: item.text #</span></a>
    </script>

============================================================
controller file
------------------------------------------------------------------------------------------------------------------
$scope.option1 = {
dataSource : treeData,
dragAndDrop : true,
template: kendo.template($("#treeview-template").html()),
loadOnDemand : true
};


$scope.edit = function(e) {
var treeview = $scope.tree;
var node = $(e.target).closest(".k-item");

if (confirm("edit?")) {
var id = treeview.dataItem(node).id;
var origin_html = $(node).find("a")[0].outerHTML;
var replacehtml = "<input type='text' id='newnode' value='"
+ treeview.dataItem(node).text + "'>";
//$(node).find("a").html(replacehtml);
$(node).find("a")[0].outerHTML = replacehtml;
$("#newnode").focus();
$(node).on("keypress","input",
function(event) {
if (event.keyCode == 13) {
var newVal = $("#newnode").val();
$(node).find("input#newnode")[0].outerHTML = origin_html;
$(node).find("a").text(newVal);
var dataItem = treeview.dataSource.get(id);
$(treeview.findByUid(dataItem.uid)).each(function() {
treeview.text(this,newVal);
});
}
});

};

=================================================================================

This is my code. 

When I click a node name, html code change contained input tag.

<a ng-click="edit($event")><span> node name </span></a>
-> <input type="text" id="newnode" value="node name">

But I can't write down anythin in it. A cusor blur away immidiately.

Why it happened? and how to fix it?

And there is any way to change treeview's option 'dragAndDrop: true'  to 'dragAndDrop:false' after called $scope.edit() function?

please help!! ㅠ.ㅠ

We are using KendoUI TreeView with AngularJS.

DataSource attached to TreeView via k-data-source attribute.
If DataSource initialized via ajax request - TreeView not updated and still empty.

Example of such behavior: http://dojo.telerik.com/iGAbu

Is it possible to hide the Y-axis with the multi access line graph?  

I am dealing with with about 10 different data sets that are disproportionate in size so I am not able to use one axis.  

My plan is to just show the lines on the graph and have robust tooltips that refer to the actual data that the pt is referring to.  What is more important to me is that I can show when there were spikes in data.