I am porting a Silverlight website to HTML5 for my company and we are heavily using Telerik controls, as it's one of the only frameworks that has the richness we had while using Silverlight.  We have had great success as Telerik has had every widget and feature we had in our silver light, so it's been great being able to use a single framework for all of our grid and charting needs.

What I am stuck on right now is creating a grid that has a single column but supports different data types for each row.  For example the column might had a field for floats, a drop down menu, and a field for strings.  In Silverlight this was almost no effort to do.  You could take your class instance and drop it in a grid in XAML and XAML knew all of the data types and made each cell match the type(i.e. and editable string field for a string, a drop down menu for an enum, etc.).

What I am wondering is how to achieve this same functionality in Telerik.  Keep in mind that the data source is not an IEnumerable, it is a very large class instance with hundreds of different data members of differing types(int, float, bool, enum).  I attached a screenshot of what this looks like in silver light.  There are 2 columns in the screenshot, the left is a read-only text field, and the right-side column is where you change the values. 

I'm trying to render a grid on demand in a tab using the nw component views. I have tried the following but non work.

 

 

 

 

 

Hello-

I am having an issue accessing my ICollection <Image> Images in the ClientTemplate. It is accessible from the kendo datasource, but not in the ClientTemplate script; however, all of other variables of a different type from my class are accessible. The Image class has a member of type string called "name". My script to access that variable is below. When I load this page, the ListView comes up empty.

 

 

How I successfully access the variable from the dataSource:

 

How does my syntax need to change to access it in the ClientTemplate script?

Thank you for the help,

S

Hi,

I am new to Telerik controls. I am trying to bind grid to datasource, not sure what am I doing wrong but grid is always empty.

Here is some sample code.

 public IActionResult Index(string YYYYQ)
        {
            var initialYYYYQ = YearAndMonth.AbstractStartYearMonth();
            SelectedMeasuresViewModel sModel = GetMeasureSelectionData(initialYYYYQ);      
            return View(sModel);
        }

 public ActionResult MeasureSelections_Read([DataSourceRequest] DataSourceRequest request)
        {
            return Json(GetMeasureSelectionData("2017-02"));
        }

private SelectedMeasuresViewModel GetMeasureSelectionData(string YYYYMM)
        {

         measureSelectionList = someData;
            SelectedMeasuresViewModel sModel = new SelectedMeasuresViewModel();
            sModel.SelectedYYYYMM = YYYYMM;
            sModel.SelectedMeasureSets = measureSelectionList; (this is list of MeasureListData)

            return sModel;
        }

 

View is simple

@using (Html.BeginForm())
{

 @Html.DropDownListFor(m => m.SelectedYYYYMM, YearAndMonth.MonthDropdownOptions(), new { onchange = "this.form.submit(); " })

@Html.Partial("MeasureSelections", Model.SelectedMeasureSets)

}

Partial View is

@(Html.Kendo().Grid<EncorI.Web.Areas.Admin.Models.MeasureListData>()
        .Name("measureSelectionGrid")
        .Columns(columns =>
        {
            columns.Bound(c => c.Enabled).Width(100);
            columns.Bound(c => c.MeasureSetID).Width(100);
            columns.Bound(c => c.MeasureSetName).Width(300);
            columns.Bound(c => c.HospitalID).Width(100);
            columns.Bound(c => c.HospitalName).Width(300);
        })
        .HtmlAttributes(new { style = "height: 850px;" })
        .Scrollable()
        .Groupable()
        .Sortable()
        .Pageable(pageable => pageable
            .Refresh(true)
            .PageSizes(true)
            .ButtonCount(5))
        .DataSource(dataSource => dataSource
            .Ajax()
            .Read(read => read.Action("MeasureSelections_Read", "measureSelectionGrid"))
            .PageSize(20)
        )
)

Is there a simple way to change the background color of the Month/Year view?

Thanks.

-------------------------------------------------------------------------------------------------------------

<telerik:RadDatePicker RenderMode="Lightweight" ID="FromScreeningDatePicker" runat="server" Width="120px"
ClientEvents-OnDateSelected="FromDateSelected"

Calendar-CalendarTableStyle-BackColor="White"

Calendar-TitleStyle-BackColor="White"
MinDate='<%# Convert.ToDateTime("01/01/1900")%>' MaxDate='<%# Convert.ToDateTime(DateTime.Now.ToString("MM/dd/yyyy"))%>'
DbSelectedDate='<%# startDate %>' FocusedDate="01/01/2016">

</telerik:RadDatePicker>

How do I get the resource (RoomID) from an associated click event:

      var scheduler = $("#scheduler").data("kendoScheduler");
      scheduler.wrapper.on("click touchend", " .k-scheduler-content td", function (e) {
      var slot = scheduler.slotByElement(e.originalEvent.target);
                if (slot) {
                    alert(slot.startDate);
                    alert(slot.endDate);
                    alert(slot.resources.RoomID);?????

                }

     });

Hi,

I'm binding a grid to a collection of my model and when that collection is empty the grid is making a post to get data.

Trying to avoid that useless ajax requests I set AutoBind(false) but when I return a collection with data the grid do not bind it.

How can I prevent the request event if there is no initial data?

I have a grid and I am doing ajax batch updates using the following methods in my controllers with Entity Framework. This is working fine.

http://docs.telerik.com/aspnet-mvc/helpers/grid/editing/batch-editing

Do you have a controller code example (hard to find on the net) to perform the same type of batch update but with a many-to-many db relationship as I have added a multiselect component on my grid?

This is a follow up of my post here

Hello,

 

I have a problem with the listview widget, that occurs just in IE11.

Please open the demo: http://demos.telerik.com/aspnet-core/listview/keyboard-navigation

Run this command in the console: $('#main').css({ height: 400, overflow: 'auto' }).find('.product-view.k-widget').on('click', function () { alert('clicked'); });

What we do: Set the main area to a small height and set it scrollable. Add click listener to all items and show an alert on click.

If you now click on an item, everything is working as expected. Now scroll down with $('#main').scrollTop(700); and try to click one of the bottom items of the list. In this moment the widget gets the focus and scrolls to its beginning, but the click is not registered. In my application I also have a scrollable container with a listview inside and I need to register item clicks. Our application MUST work in IE11, because our customer is just using IE. It would be great if you analyze the problem and fix it in the future. For now I definately need a workaround asap. Thank you.

The DateInput server side wrapper does not appear to work with nullable DateTimes. In the below code, if 'TaxDate' is a nullable DateTime when the page is rendered the control will always display 'month/day/year' (as it does when the value is null) even if the value being passed to it isn't null.

I tried setting the .value() property on the control but it does not accept nullable DateTimes.

 

                @(Html.Kendo().DateInput()
                            .Name("TaxDate")
                            .HtmlAttributes(new { style = "width:100%;", @class = "autoSelectText" })

 

From the demo page it looks as if null is a supported state, does the server side wrapper not support it?

 

Thanks,

Brian