I have strange behavior from the Kendo MVC grid (version R2 2021) when used in a Sitefinity Widget (Sitefinity version 13.3.7600).  The grid appears to not bind properly to the datasource in any browser except Internet Explorer 11.  I've tried Firefox (89.0), Chrome (91.0.4472.77) and Edge (91.0.864.41). For some reason Internet Explorer works.

Originally I was thinking it had to do with some of the Kendo .js scripts and/or .css files not being loaded before the bind operation, but as a test I added a refresh button and set AutoBind(false). The Controller, Model and View code work just fine in my standalone test application but when the same code is used in a Sitefinity Widget the data won't appear.

The Controller's action method is being called (I set a breakpoint) and returning what appears to be properly formatted JSON data. I have tried switching the grid to bind on a <dynamic> (instead of my specific class) and using the .Model() syntax, I have even tried different Models, including some without a List<> and just 6 separate decimal properties to see if it was a problem using a collection (it wasn't).

In each case all the test code I try **works in Internet Explorer** and not any other major browser.

*NOTE: My Widgets are all in their own separate assembly (which is why you'll see the ControllerToolboxItemAttribute). That .csproj is included in my Sitefinity solution.*

The following is an example of what I'm using:

**Model Classes (Mvc\Models)**
```
namespace MyWidget.Mvc.Models
{
    public class MyRateClass
    {
        public string Maturity { get; set; }
        public List<decimal> Rates { get; set; }
    }

}
```
```
namespace MyWidget.Mvc.Models
{
    public class MyRatesViewModel
    {
        public int MaxTiers { get; set; }
        public string Message { get; set; }
    }

}
```

**Controller (Mvc\Controllers)**
```
using MyWidget.Mvc.Models;
using System.Collections.Generic;
using System.Web.Mvc;
using Kendo.Mvc.UI;
using Kendo.Mvc.Extensions;
using Telerik.Sitefinity.Mvc;

namespace MyWidget.Mvc.Controllers
{
    [ControllerToolboxItem(Name = "MyWidget.Mvc.Controllers.Rates", SectionName = "CustomWidgets", Title = "My Broken Widget")]
    public class RatesController : Controller
    {
        public ActionResult Index()
        {
            MyRatesViewModel vm = new MyRatesViewModel() {
                MaxTiers = 6, Message = "Broken"
            };
            
            return View(vm);
        }

        public ActionResult RetrieveRates([DataSourceRequest] DataSourceRequest request)
        {
            // Mock Data
            List<MyRateClass> reportRates = new List<MyRateClass>()
            {
                new MyRateClass() { Maturity = "1", Rates = new List<decimal>() { 0, 0, 0, 0, 0, 0 } },
                new MyRateClass() { Maturity = "2", Rates = new List<decimal>() { 0.07453M, 0.0623M, 0, 0, 0, 0 } }
            };

            DataSourceResult dsResult = reportRates.ToDataSourceResult(request);

            return Json(dsResult, JsonRequestBehavior.AllowGet);
        }
    }
}
```

**View (Mvc\Views\Rates)** - Verison using .AutoBind(false)

*NOTE: The links that begin with "kendoui/" are all pointing to files in my Sitefinity/ResourcePackages directory. They do load properly. I have also tried them as embledded resources in my Widget assembly and they work that way as well.*
```
@using MyWidget;
@using MyWidget.Mvc.Models;
@using Kendo.Mvc.UI;
@using Kendo.Mvc.Extensions;
@using Telerik.Sitefinity.Frontend.Mvc.Helpers;
@using Telerik.Sitefinity.Modules.Pages;

@model MyRatesViewModel

@Html.StyleSheet(Url.WidgetContent("kendoui/styles/kendo.common.min.css"), "head", false)
@Html.StyleSheet(Url.WidgetContent("kendoui/styles/kendo.default.min.css"), "head", false)
@Html.StyleSheet(Url.WidgetContent("kendoui/styles/kendo.bootstrap-v4.min.css"), "head", false)
@Html.Script(ScriptRef.JQuery, "head") <!-- required for Kendo to work -->
@Html.Script(Url.WidgetContent("kendoui/js/jszip.min.js"), "head") <!-- required for Excel Exports to work -->
@Html.Script(Url.WidgetContent("kendoui/js/kendo.all.min.js"), "head") <!-- required for Kendo MVC to work -->
@Html.Script(Url.WidgetContent("kendoui/js/kendo.aspnetmvc.min.js"), "head") <!-- required for Kendo MVC to work -->
<div class="row">
    <div class="col-12">
        <div>
            <table style="overflow: auto; border-collapse: collapse; width: 100%; max-width: 600px;">
                <tr>
                    <td style="border-right: #aca899 1px solid; border-top: #aca899 1px solid; border-left: #aca899 1px solid;">
                        <p>@Model.Message</p>
                    </td>
                </tr>
            </table>
        </div>
        @(Html.Kendo().Grid<MyWidget.Mvc.Models.MyRateClass>()
            .Name("rategrid")
            .AutoBind(false)
            .Columns(columns =>
            {
                columns.Bound(p => p.Maturity);

                for (int i = 0; i < Model.MaxTiers; i++)
                {
                    var tier = i + 1;

                    columns.Template(p => { }).ClientTemplate(string.Format("#=kendo.toString(Rates['{0}'], \"0.00\")#", i)).Title(string.Format("Tier {0}", tier));
                }
            })
            .ToolBar(toolbar =>
            {
                toolbar.Excel();
            })
            .Selectable(selectable => selectable
                .Mode(GridSelectionMode.Multiple)
                .Type(GridSelectionType.Row))
            .AllowCopy(true)
            .DataSource(dataSource => dataSource
                .Ajax()
                .ServerOperation(false)
                .PageSize(25)
                .Read(read => read.Action("RetrieveRates", "Rates"))
            )
        )
    </div>
</div>
<input type="button" onclick="myfunction ()" value="Load Grid">

<script type = "text/javascript">
    function myfunction() {
        var grid = $("#rategrid").data("kendoGrid");
        grid.dataSource.read();
        grid.refresh();
    }  
```

Clicking "Load Grid" will properly refresh the empty grid and cause it to display 2 rows when used in IE 11. The fact that this works in IE 11 and not in any other is a real head scratcher. Any assistance is appreciated!

Hi,

I would like to know how to setup a generic MVC layout(page) with a (panelbar) menu on the left (collapsable when mobile) 
together with a Breadcrumb. Should be responsive / mobile first.
Actually something like your demos page navigation, but then the menu should be collapsable. Like the panelbar.

Is there a complete example for this ? Or do I have to fuzzle manually to achieve this ?

(At first I was thinking about using the menu control, but to my surprise I saw that control is not responsive.)

Martin

Hello,

 

i'm using MVC5 Razor helper to create grid and i'm trying to show specific autocomplete values in filter row. As i undestood it from forums and docs i have to replace standard filter row input by manually creating kendoAutoComplete(...) with my own dataSource, as shown for example here with classic filter menu:

https://demos.telerik.com/aspnet-mvc/grid/filter-menu-customization

or here with filter row:

https://www.telerik.com/forums/server-side-filtering-with-row-filter-mode-filters-too-soon!

My custom JS autocomplete:

My server method:

When i try to replace input by defining:

my JS function is executed on grid init and no errors are shown in browser console. But when i try to filter, the automatic autocomplete on filter input keeps showing values as normaly from grid dataSource (standard behaviour) and my controller method won't get called.

If i try to replace input by defining:

my JS function won't get called at all.

 

What am i doing wrong here?

 

PS: I've tried with following versions:

telerik.ui.for.aspnetmvc.hotfix.2019.2.619.commercial.digitally-signed

and

telerik.ui.for.aspnetmvc.hotfix.2021.2.511.commercial.digitally-signed

Hello

I am trying to use Rowtemplate on a Treelist so that we can completely control how the row is rendered, however once i have my Treelist up and running with a Rowtemplate then all the editing functionality disappears.

The cell editing works perfectly when no RowTemplateId is specified and as soon as i enable my custom Rowtemplate the editing stops working immediately, i even try manually calling edit on a cell, however no editing seems to work once i start using the custom RowTemplate.

But all the rest of the RowTemplate functionality is working, so is RowTemplates only for displaying elements right now or is it a bug?

 

Cheers

Uffe

Hi

I am trying to make the scheduler, day week and month views to fit only a single screen without needing to horizontally scroll. But each day takes up 50% of the screen and its totally unnecessary wasting of the screen space.

Google searches dont give me results, or tell me that it cannot be done.. AND YET, every single demo on the telerik website perfectly fits into a div that takes up 80% of the width of the screen. So its possible, dont tell me it is not. 

How?

Here is some code:

cshtml file:

Displaying broken German umlauts in standalone Telerik Reporting Designer. I get this data from Postgres datasource to textboxes and table values, but on a preview and in pdf file shows incorrect symbols of German language. How can I fix that?. Thanks.

Hi,

I want to load the grid either or both the below ways:
1. On change (selected index changed) event of DropDownList. The selected value from dropdown should be passed to grid and based on it grid should display result.
2. On click of the button event. The selected value from dropdown should be passed to grid on button click and based on it grid should display result.

Do we have any kind of example which shows meets my above requirements or any kind of lead that I look into it will be very helpful.

Thanks,
Nirav

Good day guys,

how possible is this, to send input textbox value to autocomplete textbox while typing. and the autocomplete should be set to readonly.

see attached image

kind regards

 

Hello, 

I want to Fetch all files in a local Folder (Directory) and populate file names and present them in my view page as a drop down list.

taking the name of the file selected and save it in my table as a string value.

any suggestions please ?

Thank you in advance.

I check on site some examples for drag-drop in diagram bug that is only available for ASP.Net AJAX but I need them in ASP.NET MVC. I attached a link as well for reference.

https://demos.telerik.com/aspnet-ajax/diagram/examples/interactions/defaultcs.aspx

So, anybody helps me that it is available for ASP.NET MVC or not.