I'm trying to implement filter checkboxes with my dynamic column grid. I return a List<string> of options that I retrieve based on the PropertyName that I pass to the read action of the Filterable property.

I keep getting the following javascript error, where X33 is the generic column name that is mapped to the actual data column. Any advice would be great.

Hello, as the title says, I'm trying to add a vertical splitter to the right side of a grid - there's a functionality on the right of the grid which allows users to show listed details, and I want to allow them to decrease the size of the grid.

Unfortunately, that's the second day I'm battling this issue and it doesn't seem anyone was facing this problem on MVC - only I saw a similar AJAX problem.

I attached a schematic view of what I'm trying to achieve. Thanks in advance for any help.

Hello

I'm almost ending a project development that includes MVC 2017.1.233 ( Feb 23 2017)
If I just update to 2017.2.504 (May 4 2017) will I need to update the source code to make the application work with this new version ?
Only the DLL should be updated?  js and css too?
Best regards and tank you.

I am trying to use the Kendo Grid in an Angular controller.  The DataSource posts to an MVC Controller.  I need to send the data collected from the user in the form as well as the DataSourceRequst to the MVC Controller.  My dataSource for the grid in the Angular controller looks like this:

dataSource: new kendo.data.DataSource({
                type: "aspnetmvc-ajax",
                transport: {
                    read: {
                        url: "/SSQV4/SSQV5/Search/SubmitCriteria",
                        data: { form: $scope.form }
                    }
                },
                schema: {
                    data: "Data",
                    total: "Total"
                },
                pageSize: 25,
                serverPaging: true,
                serverFiltering: true,
                serverSorting: true
            }),

The method in the MVC Controller looks like this:

        public async Task<ActionResult> SubmitCriteria([DataSourceRequest]DataSourceRequest command, ContractorSearchViewModel form)

The problem is that is the values in $scope.form are set using ng-model on any inputs like <input type="text" ng-model="form.UnitID">, although it shows a value in $scope.form.UnitID in the Angular controller, when it reaches the MVC controller it is null.  However, if instead of setting it from ng-model in an input, I set it manually in the Angular controller like $scope.form.UnitID = "123", then when the dataSource hits the MVC Controller, UnitID has value and is not null.  I can I fix this?  I need all of the information in the DataSourceRequest object as well as all of the information in the $scope.form object to get to my MVC Controller.

I also tried using a service like below:

             transport: {

                  read: function (e) {
                      generalsearchService.submitSearch(e.data, form)
                          .then(function success(response) {
                              e.success(response.data);
                          });
                  }
              },

When this hits the MVC controller, "form" is completely populated as desired, but e.data is missing the "filtering" and "sorting" which are null.  It only contains page and pageSize.  This has been a very frustrating process.  Any assistance is greatly appreciated!

Hello,

I have implemented the upload success and error template from this demo http://demos.telerik.com/aspnet-mvc/notification/templates.

I am trying to display the error template if one of three fields in the pop up template are not valid otherwise the success one.

I think it is a problem about the k-invalid class being applied to a different DOM element but I am not sure.

This boolean var invalid = (startDateField.hasClass("k-invalid") || endDateField.hasClass("k-invalid") || entitlementField.hasClass("k-invalid")) is still false even one or more of the fields have the class k-invalid

I have put in attachments the files required.

Thanks you

I have a dialog that has two linked listboxes:

@(Html.Kendo().Dialog()
        .Name("dlgEdit")
        .Title("Edit Batch")
        .Content("<div style='display: flex; flex-direction:row; align-content:flex-start; align-items:stretch;' style='width:100%;'>" +
            "<div style='display: flex; flex-direction: column; align-content:flex-start; width:48%; margin-right: 8px;'>" +
            "<h3>Department Keys</h3>" +
            "<div><input id='editSearch' type='text' placeholder='Search department keys' style='height: 28px; margin: 0; padding: 0;' onkeyup='filterDepts()'/>" +
            "<img src='" + @Url.Content("~/Images/x-mark.png") + "' style='width: 12px; margin-left: 4px; cursor: pointer;' onclick='filterClear()' /></div>" +
            Html.Kendo().ListBox()
                .Name("optional")
                .DataValueField("Value")
                .DataTextField("Text")
                .DataSource(source => source
                    .Custom()
                    .Transport(transport => transport
                        .Read(read => read
                            .Action("GetDepartments", "CouncilReport")
                        )
                    )
                )
                .DropSources("selected")
                .BindTo(new List<SelectListItem>())
                .Draggable(true)
                .Selectable(ListBoxSelectable.Single)
                .HtmlAttributes(new { title = "Department Keys", style = "flex: 1; width: 100%; margin-top: 8px;" })
                .ConnectWith("selected") + "</div>" +
            "<div style='flex: 1; display: flex; flex-direction: column; align-content:flex-start; padding: 0;'>" +
            "<h3>Batch Details</h3>" +
            "<form id='editForm'>" +
            "<input id='editDesc' type='text' placeholder='Batch name' style='height: 28px; margin: 0; padding: 0;' />" +
            "<input id='editId' type='hidden' />" +
            Html.Kendo().ListBox()
                .Name("selected")
                .DataValueField("Value")
                .DataTextField("Text")
                .Draggable(true)
                .DataSource(source => source
                    .Custom()
                    .Transport(transport => transport
                        .Read(read => read
                            .Action("GetBatchDepts", "CouncilReport")
                    )
                )
            )
            .DropSources("optional")
            .ConnectWith("optional")
            .HtmlAttributes(new { title = "Selected Keys", style = "width: 100%; height: 500px; margin-top: 8px;" })
            .BindTo(new List<SelectListItem>())
            .Selectable(ListBoxSelectable.Single) +
        "</form></div></div></div>"
    )
    .Width(1000)
    .Modal(true)
    .Visible(false)
    .Actions(actions =>
    {
        actions.Add().Text("Cancel");
        actions.Add().Text("OK").Primary(true).Action("onOkEdit");
    })
)

When I open the dialog I call a read() to reset the listboxes for the selected batch:

        var treeview = $("#treeview").data("kendoTreeView");
        var selected = treeview.select();
        var data = treeview.dataItem(selected);

        $("#editSearch").val("");
        $("#editId").val(data.id);
        $("#editDesc").val(data.Description);
        var opt = $("#optional").data("kendoListBox");
        var sct = $("#selected").data("kendoListBox");
        sct.dataSource.read();
        opt.dataSource.read({ id: data.id });
        $("#dlgEdit").data("kendoDialog").open();

Notice that I am passing the id into the read() method at this line:

opt.dataSource.read({ id: data.id });

I must not have something right because the parameter is never used and I get an error 500 from the server because there was no parameter passed to the action "GetBatchDepts".

Can someone please help me see what I am doing wrong?

I attached a file for testing the case. It's related to Kendo Date Pickers using Bootstrap modals in an MVC architecture.

First, I've included 2 datePickers. They work as expected. No problems related to using multiple controls. It also means all styles and scripts are loaded fine.

But when I add a third control in a Bootstrap modal, it looks completely different.
When analyzing the DOM, this control is rendered as a text input with the right date, but... No possibilities to use the selector that should appear as a pop up.

Thanks in advance for any help.

Hi, below please see my view I'm having issues with.  I'm trying to check for a successful save (my items are being saved out to the database correctly, so I have no reason to believe there's an issue with the save) but as you can see in the "wasSaveSuccessful" function, I'm alerting out the e.type.  The initial read alerts out "read" as expected, but after changes (done with a template column with radio buttons) it alerts out "undefined".  Not sure why, but is there another way to check for success?  I want to pop down a notification to the users when their changes have been successful.