We want to customize the DataSource Export so that it will work against any datasource regardless of the number of columns.

In the example, the cells and columns are hard coded.  We want to modify the example to read the datasource and dynamically generated the bolded sections below.

See attached.

Any ideas would be appreciated.

HI

I found a problem about ASP.NET MVC Grid : 

After web page loaded, the grid is empty (AutoBind(false), so there have no any data),
Click any column header (will invoke column sorting) but read action invoked unexpectedly,
even if ServerOperation(false).

  @(Html.Kendo().Grid<HIS.Entity.Models.TYourModel1>()
    .Name("SelectionGrid")
    ... Sortable is true ...
    .AutoBind(false)
    .Pageable(pageable => pageable.Enabled(false))
    .Columns(columns =>
    {
      columns.Bound(column => column.xxxxx).Hidden();
    })
    .DataSource(dataSource =>
    {
      dataSource.Ajax()
        .Batch(true)
        .Model(model => model.Id(m => m.Key1))
        .PageSize(20)
        .ServerOperation(false)
        .Events(events =>
        {
          events.DefaultEvents();
        })
        .Read(read => read.Action("Selection_Read", "YourController").Data("filterSelectionGrid"));
    })
    .Events(events =>
    {
    })
    .HtmlAttributes(new { @style = "height: 85%; min-height: 180px" }))


Grid sorting ServerOperation(false) behavior not matched with description - 
'... If set to false ... paging, sorting, filtering ... will be performed client-side' : 

    // Summary:
    //     Sets the operation mode of the DataSource. By default the DataSource will make
    //     a request to the server when data for paging, sorting, filtering or grouping
    //     is needed. If set to false all data will be requested through single request.
    //     Any other paging, sorting, filtering or grouping will be performed client-side.
    //
    // Parameters:
    //   enabled:
    //     True(default) if server operation mode is enabled, otherwise false.
    public TDataSourceBuilder ServerOperation(bool enabled);


UI for ASP.NET MVC R2 2017 SP1
Visual Studio 2015 Enterprise

Best regards

Chris

Hi Team,

when i try to add new scaffolding item from my controller class, i could not able to see Kendo UI Template, i tried to click all the left hand side menu options, but no luck.

I tried this option with VS 2013,2015. but its not working .i am using telerik trial version

telerik.ui.for.aspnetmvc.2017.2.621.trial

watch this video : https://www.youtube.com/watch?v=Tmz_j2GrJBk and try the option from 6.48 time line

Thanks

Sundar

Hi,

im trying to export PDF from my kendo grid but im facing some issues with pdf export settings. 

Excel is working fine.

But PDF always exports only 1 visible page from the grid (and only few columns that fit to the page). I figured out that if i remove .PaperSize("A4") it is showing all data BUT its completely ignoring template and it renders grid to pdf with all buttons. 

Thanks 

Hi, I'm trying to create a custom popup editor for my grid, however, the drop downs are not being populated or at least won't open at all.  I'm stumped.  The controller method does get hit and I see 3 values but the drop downs down open.  When I first click on them I see a quick activity indicator appear but that's it.

Popup editor code

Controller code

I'm having issue for display listview template vertically.

<div class="mainsortable">
      
    @(Html.Kendo().ListView<KendoUI_MVC.ViewModel.Product>()
        .Name("listView")
        .TagName("div")
        .ClientTemplateId("template")
        .DataSource(dataSource =>
        {
            dataSource.Read(read => read.Action("ProductGrid_Read", "ListView"));
          
        })
       
    )

    @(Html.Kendo().Sortable()
        .For("#listView")
        .Ignore(".order")
        .Filter(">div.product")
        .Cursor("move")
        .PlaceholderHandler("placeholder")
        .HintHandler("hint")
    )

</div>

</div>

<script type="text/x-kendo-tmpl" id="template">

    <div class="product">
            <div class="panel panel-default">
                <div class="panel-heading">#=ProductID# #:ProductName#</div>
                <div class="panel-body">
                    <div class="partialsortable">

                        @(Html.Kendo().ListView<KendoUI_MVC.ViewModel.Order>()
                        .Name("OrderlistView_#=ProductID#")
                        .TagName("div")
                        .ClientTemplateId("ordertemplate")
                        .DataSource(dataSource =>
                        {
                            dataSource.Read(read => read.Action("Order_Read", "ListView", new { ProductID = "#=ProductID#" }));
                        })
                                 .ToClientTemplate()
                        )

                        @(Html.Kendo().Sortable()
                        .For("#OrderlistView_#=ProductID#")
                       .Filter(">div.order")
                        .Cursor("move")
                        .PlaceholderHandler("placeholder")
                        .HintHandler("hint")

                                 .ToClientTemplate()
                        )

                    </div>
                </div>
            </div>
        </div>

</script>

<script type="text/x-kendo-tmpl" id="ordertemplate">

    <div class="order">
        Unit Price : #:UnitPrice#<br />
        Quantity : #:Quantity#<br />
        Discount : #:Discount#
    </div>

</script>

<script>

    function placeholder(element) {
        return element.clone().addClass("placeholder");
    }

    function hint(element) {
        return element.clone().removeClass("k-state-selected");
    }
    
</script>

<style>
     .mainsortable {
        min-width: 1120px;
    }
    
     .order {
        margin: 10px;
        padding: 10px;
        border: 2px solid #000;
    }

    .panel{
        margin-left:10px;
        margin-right:10px;
        
    }

    .tabstrip{
        margin-bottom:10px;
    }

    .frame{
        padding:10px;
    }

    #listView {
        padding: 10px 5px;
        margin-bottom: -1px;
        min-height: 400px;
        min-width:1120px;
    }

    .product {
        float: left;
        position: relative;
        width: 400px;
        min-height: 100px;
        cursor: default;
    }

    .k-listview:after {
        content: ".";
        display: block;
        height: 0;
        clear: both;
        visibility: hidden;
    }

</style>

In css, #listView  min-width and max-width property does not working properly.

I'm try to set

 .mainsortable {
        width: 5000px;
    }

and

 #listView {
        padding: 10px 5px;
        margin-bottom: -1px;
        min-height: 400px;
        width:5000px;
    }

seperately and it's working prperly.but its not expectable solution because can't adjust the width.

I attached following the screenshot of expected listview (Expected.png) and Issued listview (Issue.png).

Please give explanation for this issue.

Having some Grid formatting issues with a grid in a partial view, loaded via ajax function and pass it a parameter.    It appears that the grid is partially created and displayed to soon. I have attached 2 screenshot. to show what is going on. using bootstrap

Basically the process should be call the grid.  the loading.... dialog should be first, then the grid loaded when successfull with norecords shown inside of grid.  This is happening way out of order.  I am probably missing a process..

Main view:

Partial view

Hi,

I have the following grid...

$("#grid").kendoGrid({
            toolbar: ["excel"],
            excelExport: function (e) {
                e.workbook.fileName = "Test.xlsx";
                e.workbook.sheets[0].title = 'Hello World';
              
                var rows = e.workbook.sheets[0].rows;
                e.workbook.sheets[0].rows.unshift({
                    cells: [
                      {
                          value: ''
                      }
                    ],
                });
                e.workbook.sheets[0].rows.unshift({
                    cells: [
                      {
                          value: 'Football: ' + $('input[name=mnuFoot]:checked').val(),
                          bold: true
                      }
                    ],
                });
                e.workbook.sheets[0].rows.unshift({
                    cells: [
                      {
                          value: 'Soccer: ' + $('input[name=mnuSoccer]:checked').val(),
                          bold:  true
                      }
                    ],
    
                });
 
                for (var ri = 0; ri < rows.length; ri++) {
                    var row = rows[ri];

                    if (row.type == "group-footer" || row.type == "footer") {
                        for (var ci = 0; ci < row.cells.length; ci++) {
                            var cell = row.cells[ci];
                            if (cell.value) {
                                 //Use jQuery.fn.text to remove the HTML and get only the text
                                cell.value = $(cell.value).text();
                                //Set the alignment
                                cell.hAlign = "right";
                            }
                        }
                    }
                }
            },

......

How can I export the data using the same functionality as the button on the toolbar using a button outside of the grid?

Thanks,

Liem