When I am rendering the grid control (using the server rendering option), I noticed that the resulting HTML is rendered as a single line.

Is there a way to render the grid's HTML as an outlined output with each table's tag on its own line aka

<table>
<tr>
    <td>value</td>
</tr>
</table>

It would be helpful for debugging and troubleshooting (in VisualStudio, browser debugger, in Fiddler, just using View Page Source option) and even in some cases for customers (to let them using Page Source option to save the raw HTML content - I had plenty of situations when that was a savvier).

 I have posted this question on Stackoverflow, but had no real success in getting an answer.

 Hopefully someone here can help me.

 When I add this to my Grid:

I get the following error:

 When I remove the Popup edit function it works.

 Mono does not use / support System.Data.Entity.

 Furthermore, because the assembly is missing from mono, nothing in my solution uses or references that Library.

 Not event in my Web.Conf file.

 How can I solve this problem?

Hi guys,

I am havning a hard time understanding the setup process of the list view. i followed the documentation offered but i am finding it very difficult to set it up anyways. The issue i am having is that it is displaying no listview in the view.

 I deployed my site to garyrizzo.com if you are interested. just navigate to Household menu item and click on bathroom accessories.

Would appreciate if someone assists.

Here is my code:

Controller:

 public ActionResult ProductListing(string catname)
        {
            //Category cat = (from s in dbContext.Categories
            //          where s.Category1 == catname
            //          select s).Single();
            
            //int catid = cat.ID;

            //var prodlist = from s in dbContext.Products
            //                                 where s.C_ID == catid
            //                                 select s;

            //return View(prodlist);
            return View(GetProducts());
        }

        protected override void Dispose(bool disposing)
        {
            dbContext.Dispose();

            base.Dispose(disposing);
        }
                                      
        public ActionResult Products_Read([DataSourceRequest] DataSourceRequest request)
        {
            return Json(GetProducts().ToDataSourceResult(request));
        }

        public IEnumerable<ideaworktelekrik.Models.ProductViewModel> GetProducts()
        {
            var northwind = from s in dbContext.Products
                            //where s.C_ID == catid
                            select s;

            List<ideaworktelekrik.Models.ProductViewModel> prodlist = new List<ideaworktelekrik.Models.ProductViewModel>();

            foreach (Product product in northwind)
            {
                ideaworktelekrik.Models.ProductViewModel newprod = new ideaworktelekrik.Models.ProductViewModel();
                   newprod.productID = product.ID;
                   newprod.ProductName = product.Name;
                   prodlist.Add(newprod);
            }
            return prodlist;
        }
    }

Model:

          public int productID {get;set;}
        public string ProductName {get;set;}
        public decimal unitprice {get;set;}

View:

@model IEnumerable<ideaworktelekrik.Models.ProductViewModel>

<script type="text/x-kendo-tmpl" id="template">
    <div class="product">
        <img src="@Url.Content("~/ProductImages/image001.png/")" alt="#:ProductName# image" />
        <h3>#:ProductName#</h3>
    </div>
</script>

<div class="demo-section">
    @(Html.Kendo().ListView<ideaworktelekrik.Models.ProductViewModel>(Model)
    .Name("listView")
    .TagName("div")
    .ClientTemplateId("template")
    .DataSource(dataSource =>
    {
        dataSource.Read(read => read.Action("Products_Read", "Home"));
        dataSource.PageSize(15);
    })
    .Pageable()
    )
</div>

<style>
    .demo-section {
        padding: 30px;
        width: 577px;
    }

    #listView {
        padding: 10px;
        margin-bottom: -1px;
        min-width: 555px;
        min-height: 510px;
    }

    .product {
        float: left;
        position: relative;
        width: 111px;
        height: 170px;
        margin: 0;
        padding: 0;
    }

        .product img {
            width: 110px;
            height: 110px;
        }

        .product h3 {
            margin: 0;
            padding: 3px 5px 0 0;
            max-width: 96px;
            overflow: hidden;
            line-height: 1.1em;
            font-size: .9em;
            font-weight: normal;
            text-transform: uppercase;
            color: #999;
        }

        .product p {
            visibility: hidden;
        }

        .product:hover p {
            visibility: visible;
            position: absolute;
            width: 110px;
            height: 110px;
            top: 0;
            margin: 0;
            padding: 0;
            line-height: 110px;
            vertical-align: middle;
            text-align: center;
            color: #fff;
            background-color: rgba(0,0,0,0.75);
            transition: background .2s linear, color .2s linear;
            -moz-transition: background .2s linear, color .2s linear;
            -webkit-transition: background .2s linear, color .2s linear;
            -o-transition: background .2s linear, color .2s linear;
        }

        .k-listview:after, .product dl:after {
            content: ".";
            display: block;
            height: 0;
            clear: both;
            visibility: hidden;
        }
</style>

Hello,

 I have been trying to to use arrow keys (up/down) to navigate among a drop-down list's values. However it did not seem to work, even though I was able to find various examples in the documentation. So, I came upon a discrepancy (I think):

Keyboard navigation works, if the drown-down list is created (in Razor) using  Html.Kendo().DropDownList(). However, we are using Html.Kendo().DropDownListFor(). A major difference that I can see, is that the first approach creates a <select> HTML element, while the latter an <input>.

Is there a way to have keyboard navigation working with Html.Kendo().DropDownListFor() ?

Thank you very much.

When a row double click a edit form pops up and re-sizes but when add new record button is click the form is not re-sizes. 

This only works when edit button is clicked:

                $("#grid tbody").on("dblclick", "tr", function () {
                    var grid = $("#grid").data('kendoGrid');
                    grid.editRow(this);                    
                    $(".k-edit-form-container").parent().width(1200).data("kendoWindow").center();                    
                    $(".k-edit-buttons").parent().width(1200).data("kendoWindow");                    
                });

how can I use this code to re-size the form when both buttons are clicked?

I haven't found an example of how to display Awesome Icons. What to display cog next to sub menu item "User Maintenance".

Tried above in view but doesn't work.

Thanks

I've been looking into installing CacheCow ( https://github.com/aliostad/CacheCow ) , by just applying the nuget package and then adding:

to my global config file. Once i do this though, none of my grids will refresh properly, they all cache old values regardless of what i entered in them previously.  I've used the header:

for outputcache at the top, but that doesn't seem to help.  Anyone have any experience using cachecow with kendo datasources

I have an application that needs to support dragging from one TreeView onto another, where items are only copied, not moved.

 I can achieve this using the DragStart event on the destination tree, to prevent any dragging from it.  I can then identify what node has been dragged to the other tree, cancel the operation with PreventDefault, and then append the node manually (and also update the back0end database). What I can't work out how to stop, is nodes from the source tree being dragged onto other nodes in the source tree (which I want as read only).

This is because the drop event always fires from the source tree, and to find out more about the destination node (i.e. the object ID it was created with etc..) requires a call involving the TreeView's name

e.g.:- 

 As I have two TreeViews on the page, how do identify which treeview the droptarget is on (or even better, just allow the source tree to allow dragging and not dropping?

Thanks