Using Win 7, IE 8 standards mode and IE 9, MVC 4, jQuery 2.0.3, Kendo UI w/ MVC Wrappers 2013.2.918.340
I have a relatively simple grid in a MVC View that renders perfectly OK on page load when containing no data (in all browsers).  But when the data source contains at least one row, the initialization script appears to be rendered twice in the DOM,which causes a sort of empty "phantom" grid to appear below the real one.  This also throws off all the remaining DOM elements in the page, as if there is an unclosed tag or invalid HTML somewhere. See attached screenshots.  Other grids in this app with a similar configuration also work fine.

Here is my grid config:

@(Html.Kendo().Grid(@Model.OrderViewModel.Parcels)
  .Name("OrderViewModel_OrderParcels")
  .ToolBar(tb => tb.Create().Text("Add"))
  .Columns(c =>   {
 c.Bound(model => model.OrderParcelId).Hidden();
 c.Bound(model => model.OrderId).Hidden();
 c.Bound(model => model.Number);
 c.Command(command =>  {
 command.Edit().Text(" ").UpdateText(" ").CancelText(" ");
 command.Destroy().Text(" ");
}).Width(300);
  })
  .Editable(edit =>   {
 edit.Mode(GridEditMode.InLine);
 edit.DisplayDeleteConfirmation("Are you sure you want to remove this Parcel Number?");
  })
  .DataSource(ds => ds.Ajax()
 .Model(m => m.Id(x => x.OrderParcelId))
 .Create(x => x.Action("AddParcel", "Order"))
 .Update(x => x.Action("AddParcel", "Order"))
 .Destroy(x => x.Action("RemoveParcel", "Order"))
 .ServerOperation(false))
  .Scrollable(scroll => scroll.Height(50))
  )
</fieldset></div>

Here is the output (copied from IE Dev Tools > View Source > DOM (Page)):
<DIV class="row">
<FIELDSET>
<LEGEND>Parcels</LEGEND>
<DIV id="OrderViewModel_OrderParcels" class="k-widget k-grid k-secondary" data-role="grid" jQuery111002042388671417229="202">
<DIV class="k-toolbar k-grid-toolbar k-grid-top slvzr-first-child" jQuery111002042388671417229="213">
<A class="k-button k-button-icontext k-grid-add" href="http://localhost:54886/Order/Edit/1?OrderViewModel_OrderParcels-mode=insert"><SPAN class="k-icon k-add"></SPAN>Add</A>
</DIV>
<DIV style="PADDING-RIGHT: 17px" class="k-grid-header">
<DIV class="k-grid-header-wrap">
<TABLE role="grid">
<COLGROUP><COL /><COL style="WIDTH: 300px" /></COLGROUP>
<THEAD class="">
<TR class="">
<TH style="DISPLAY: none" class="k-header slvzr-first-child" scope="col" data-title="Order Parcel Id" data-field="OrderParcelId">
<SPAN class="k-link slvzr-not4046k-state-disabled41">Order Parcel Id</SPAN>
</TH>
<TH style="DISPLAY: none" class="k-header" scope="col" data-title="Order Id" data-field="OrderId">
<SPAN class="k-link slvzr-not4046k-state-disabled41">Order Id</SPAN>
</TH>
<TH class="k-header" scope="col" data-title="Parcel Num" data-field="Number">
<SPAN class="k-link slvzr-not4046k-state-disabled41">Parcel Num</SPAN>
</TH>
<TH class="k-header" scope="col">
<SPAN class="k-link slvzr-not4046k-state-disabled41">&nbsp;</SPAN>
</TH>
</TR>
</THEAD>
</TABLE>
</DIV>
</DIV>
<DIV style="HEIGHT: 50px" class="k-grid-content" jQuery111002042388671417229="209">
<TABLE role="grid" jQuery111002042388671417229="211">
<COLGROUP><COL /><COL style="WIDTH: 300px" /></COLGROUP>
<TBODY>
<TR role="row" data-uid="aecb476a-cbda-4b2f-9465-92464cde82de">
<TD style="DISPLAY: none" role="gridcell">
11
</TD>
<TD style="DISPLAY: none" role="gridcell">
1
</TD>
<TD role="gridcell">
1
</TD>
<TD role="gridcell">
<A class="k-button k-button-icontext k-grid-edit" href="http://localhost:54886/Order/Edit/1#"><SPAN class="k-icon k-edit"></SPAN></A><A class="k-button k-button-icontext k-grid-delete" href="http://localhost:54886/Order/Edit/1#"><SPAN class="k-icon k-delete"></SPAN></A>
</TD>
</TR>
</TBODY>
</TABLE>
</DIV>
</DIV>
<SCRIPT>

jQuery(function(){jQuery("#OrderViewModel_OrderParcels").kendoGrid({"columns":[{"title":"Order Parcel Id","hidden":true,"field":"OrderParcelId","filterable":{},"encoded":true,"editor":"\u003cinput class=\"text-box single-line\" data-val=\"true\" data-val-number=\"The field OrderParcelId must be a number.\" id=\"OrderParcelId\" name=\"OrderParcelId\" type=\"number\" value=\"0\" /\u003e\u003cspan class=\"field-validation-valid\" data-valmsg-for=\"OrderParcelId\" data-valmsg-replace=\"true\"\u003e\u003c/span\u003e"},{"title":"Order Id","hidden":true,"field":"OrderId","filterable":{},"encoded":true,"editor":"\u003cinput class=\"text-box single-line\" data-val=\"true\" data-val-number=\"The field OrderId must be a number.\" id=\"OrderId\" name=\"OrderId\" type=\"number\" value=\"0\" /\u003e\u003cspan class=\"field-validation-valid\" data-valmsg-for=\"OrderId\" data-valmsg-replace=\"true\"\u003e\u003c/span\u003e"},{"title":"Parcel Num","field":"Number","filterable":{},"encoded":true,"editor":"\r\n\u003cinput class=\"k-textbox\" data-val=\"true\" data-val-length=\"The field Parcel Num must be a string with a maximum length of 50.\" data-val-length-max=\"50\" data-val-required=\"The Parcel Num field is required.\" id=\"Number\" maxlength=\"50\" name=\"Number\" type=\"text\" value=\"\" /\u003e\u003cspan class=\"field-validation-valid\" data-valmsg-for=\"Number\" data-valmsg-replace=\"true\"\u003e\u003c/span\u003e"},{"width":"300px","command":[{"name":"edit","buttonType":"ImageAndText","text":{"cancel":" ","update":" ","edit":" "}},{"name":"destroy","buttonType":"ImageAndText","text":" "}]}],"editable":{"confirmation":"Are you sure you want to remove this Parcel Number?","mode":"inline","create":true,"update":true,"destroy":true},"toolbar":{"command":[{"name":null,"buttonType":"ImageAndText","text":"Add"}]},"dataSource":{"transport":{"prefix":"","read":{"url":""},"update":{"url":"/Order/AddParcel"},"create":{"url":"/Order/AddParcel"},"destroy":{"url":"/Order/RemoveParcel"}},"type":"aspnetmvc-ajax","schema":{"data":"Data","total":"Total","errors":"Errors","model":{"id":"OrderParcelId","fields":{"OrderParcelId":{"type":"number"},"OrderId":{"type":"number"},"Number":{"type":"string"}}}},"data":{"Data":[{"OrderParcelId":11,"OrderId":1,"Number":"1"}],"Total":1}}});});
</SCRIPT>
</FIELDSET>

</DIV>
</FORM>
<SCRIPT>

jQuery(function(){jQuery("#OrderViewModel_OrderParcels").kendoGrid({"columns":[{"title":"Order Parcel Id","hidden":true,"field":"OrderParcelId","filterable":{},"encoded":true,"editor":"\u003cinput class=\"text-box single-line\" data-val=\"true\" data-val-number=\"The field OrderParcelId must be a number.\" id=\"OrderParcelId\" name=\"OrderParcelId\" type=\"number\" value=\"0\" /\u003e\u003cspan class=\"field-validation-valid\" data-valmsg-for=\"OrderParcelId\" data-valmsg-replace=\"true\"\u003e\u003c/span\u003e"},{"title":"Order Id","hidden":true,"field":"OrderId","filterable":{},"encoded":true,"editor":"\u003cinput class=\"text-box single-line\" data-val=\"true\" data-val-number=\"The field OrderId must be a number.\" id=\"OrderId\" name=\"OrderId\" type=\"number\" value=\"0\" /\u003e\u003cspan class=\"field-validation-valid\" data-valmsg-for=\"OrderId\" data-valmsg-replace=\"true\"\u003e\u003c/span\u003e"},{"title":"Parcel Num","field":"Number","filterable":{},"encoded":true,"editor":"\r\n\u003cinput class=\"k-textbox\" data-val=\"true\" data-val-length=\"The field Parcel Num must be a string with a maximum length of 50.\" data-val-length-max=\"50\" data-val-required=\"The Parcel Num field is required.\" id=\"Number\" maxlength=\"50\" name=\"Number\" type=\"text\" value=\"\" /\u003e\u003cspan class=\"field-validation-valid\" data-valmsg-for=\"Number\" data-valmsg-replace=\"true\"\u003e\u003c/span\u003e"},{"width":"300px","command":[{"name":"edit","buttonType":"ImageAndText","text":{"cancel":" ","update":" ","edit":" "}},{"name":"destroy","buttonType":"ImageAndText","text":" "}]}],"editable":{"confirmation":"Are you sure you want to remove this Parcel Number?","mode":"inline","create":true,"update":true,"destroy":true},"toolbar":{"command":[{"name":null,"buttonType":"ImageAndText","text":"Add"}]},"dataSource":{"transport":{"prefix":"","read":{"url":""},"update":{"url":"/Order/AddParcel"},"create":{"url":"/Order/AddParcel"},"destroy":{"url":"/Order/RemoveParcel"}},"type":"aspnetmvc-ajax","schema":{"data":"Data","total":"Total","errors":"Errors","model":{"id":"OrderParcelId","fields":{"OrderParcelId":{"type":"number"},"OrderId":{"type":"number"},"Number":{"type":"string"}}}},"data":{"Data":[{"OrderParcelId":11,"OrderId":1,"Number":"1"}],"Total":1}}});});
</SCRIPT>

The italicized </FORM> tag above should not appear until way further down the page.  With the empty datasource grid, the <SCRIPT> tag is not rendered twice and the resulting HTML is valid.  I was thinking this is some kind of string escaping issue in the script template, but I can't spot anything wrong....

Please help, as this is blocking a critical part of our application for all IE8 and IE9 users


 

 have a MVC 5. project installed kendo mvc (Telerik MVC). I installed the components by hand as your installer didn't work for 5.1. However this is not the issue for this post.
I installed the components in the Content and js scripts folder like this Content-kendo-2013.3.1414 folder.
Everything worked in debug mode. As soon I used release mode the application couldn't find the theme sprite image in the folder. It was referenced to the Content-kendo-theme folder instead. (Same result latest release 1503).
I moved all the files to be direct under kendo folder and all worked again in debug and release mode.

So my question: Is this a bug or have I done something terrible...  :) 

I am calling LoadContentFrom for the panel content, but this function strips out the HTML markup on that content, and just shows the text.  How do I work around that?

Hi all,

I am trying to update the text of a node without having to refresh the whole tree. 
Is this possible?

I have tried unsuccessfully with the following:
var treeview = $("#ProcessTree").data("kendoTreeView");
var node = treeview.dataItem(treeview.select());
node.Name = "Updated Text";
treeview.collapse(node);
node.loaded(false);
node.load();
treeview.expand(node);

Thanks,
Keith. 

Hi all,

In Chrome, I am getting a scrollbar to the right of the Treeview (see attached image). 
When I expand the lowest child - the scrollbar disappears. This issue does not happen in IE

Thanks,
Keith. 

Hi
I am looking for  the solution
for changing content of header on select event of child of previous header. I have attached file in that country and plant is there on select of country (Paris) 
plant(of paris) should load accordingly.

Hi Guys, 
I'm trying to insert a treeview in my application so i checked your online examples..

My scenario would fall into "Binding to a remote data" but it's a little more complex.

I have 3 different objects that I need to put in my tree (they came from EF and they are not linked automatically - ef and oracle doesn't work with FK on unic constraints):

Object A

ObjectA is the main-level object...it will occurs only on the root level of the tree.
Each Object A always have a list of object B

ObjectB

each ObjectB always have a list of object C

ObjectC

Here's a tricky part...
Each objectC may have a list of objectC...

now..In your example the read method of the tree call always the same action and whether or not has a parameter load a different node.

In my case I have different object...Is there a way to Implement your example in my scenario?
I guess that, if there's not, I'll have to load all root-nodes and with js load every node's children on click.
I already tried this one and my tree doesn't have to icon to expand a node. I also tried adding to objecta a bool property (like HasChild) and also to fullfill the child list in the first call.
Same appens if I try to replicate your example..I load the root-level but no node is expandable..so it never call the action with the id param.

What Am I doing wrong?
Thanks
Fabio

I have an AutoComplete that is context dependent on other fields of the View screen.  For example, if a work order number is null, the autocomplete should function normally, however, if the workorder is present, then the autocomplete should not accept any changes because the value is then dictated by the work order and would only change if the work order changed.  I don't want to make the field read-only because then it won't post it's data to the server.  That would make things complicated and I adore simple.

I don't find an onBeforeChange event for the widget... is it possible to hook one up, and if so how?  If not, please suggest a solution.

Thanks!

When entering Edit mode (either In Line or Batch) the columns of the grid are automatically resizing.  Is there any way to get them to stay at the static width they appear in when in read only mode?

Hi,

When I create a hyperlink in the nested grid, it is using the parent unique id over the child unique id.  This results in an incorrect URL.

Below is the code for the template kendo grid.