Dropdownlist Virtualization Kendo MVC

[Adarsh]

We are using the below code for loading data in a Kendo dropdown inside a grid. The data is getting loaded, but after applying filter and selecting an item in the filter only the filter data is displayed in the dropdown. The dropdown is not getting refreshed to load the entire data. Please help

 

@(Html.Kendo().DropDownList()
            .Name("VehicleSegment") // The name of the widget should be the same as the name of the property.
            .DataValueField("VehicleSegmentID") // The value of the dropdown is taken from the ID property.
            .DataTextField("VehicleSegmentName") // The text of the items is taken from the EmployeeName property.
           .MinLength(3)
           //.OptionLabel("---Select Vehicle Segment ---")
          .HtmlAttributes(new { style = "width:100%" })
         .Template("#= VehicleSegmentID # | For: #= VehicleSegmentName #")
          .Height(290)
           //.Filter(FilterType.Contains)
           .Filter("contains")
          .DataSource(source =>
          {
              source.Custom()
                  .ServerFiltering(true)
                  .ServerPaging(true)
                  .PageSize(80)
                  .Type("aspnetmvc-ajax") //Set this type if you want to use DataSourceRequest and ToDataSourceResult instances
                  .Transport(transport =>
                  {
                      transport.Read("Virtualization_Read", "Program");
                  })
                  .Schema(schema =>
                  {
                      schema.Data("Data") //define the [data](http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#configuration-schema.data) option
                            .Total("Total"); //define the [total](http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#configuration-schema.total) option
                  });
          })
          .Virtual(v => v.ItemHeight(20).ValueMapper("valueMapper"))

[Nencho]

Hello Adarsh,

I have performed some local tests, but I was unable to replicate the described issue. Are you able to replicate it in our online demo below?

https://demos.telerik.com/aspnet-mvc/dropdownlist/virtualization

If not, please isolate it in a simplified runnable example and provide us with it, so we could revise the issue locally and pin down the reason for it.

Regards,
Nencho
Progress Telerik

[Adarsh]

Hi Nencho,

Please find below the code. I am pasting the code from .cshtml file and from controller file

transport.Read("Virtualization_Read", "Program");
})
.Schema(schema =>
{
schema.Data("Data") //define the [data](http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#configuration-schema.data) option
.Total("Total"); //define the [total](http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#configuration-schema.total) option
});
})
.Virtual(v => v.ItemHeight(20).ValueMapper("valueMapper"))
//.Events(events => events.Select("select"))
)

 

 

function valueMapper(options) {
// debugger;
$.ajax({
url: "@Url.Action("Orders_ValueMapper", "Program")",
data: convertValues(options.value),
success: function (data) {
options.success(data);
}
});
}
function convertValues(value) {
var data = {};
value = $.isArray(value) ? value : [value];
for (var idx = 0; idx < value.length; idx++) {
data["values[" + idx + "]"] = value[idx];
}
return data;
}

 

 

public ActionResult Virtualization_Read([DataSourceRequest] DataSourceRequest request)
{
IList<VehicleSegmengtProgam> VehicleSegmentformList = new List<VehicleSegmengtProgam>();
VehicleSegmentformList = objProgram.GetAllVehicleSegmentForComboox(Convert.ToInt32(CurrentUser.ProductGroupID));
TempData["VehicleSegmentformList"] = VehicleSegmentformList;
return Json(VehicleSegmentformList.ToDataSourceResult(request));
}
public ActionResult Orders_ValueMapper(int[] values)
{
var indices = new List<int>();
IList<VehicleSegmengtProgam> VehicleSegmentformList = new List<VehicleSegmengtProgam>();
VehicleSegmentformList =(IList < VehicleSegmengtProgam >)TempData["VehicleSegmentformList"];
TempData.Keep();
if (values != null && values.Any())
{
var index = 0;
foreach (var order in VehicleSegmentformList)
{
if (values.Contains(order.VehicleSegmentID))
{
indices.Add(index);
}
index += 1;
}
}
return Json(indices, JsonRequestBehavior.AllowGet);
}

 

[Dimitar]

Hello Adarsh,

I am attaching an ASP.NET MVC solution, where a similar scenario to the one described is demonstrated (Integrating virtualized Kedno UI DropDownList as Grid inline editor).

With the above solution, the DropDownList is successfully bound to the remote data and server filtering is configured correctly. Could you inspect the provided solution and verify if everything is working correctly on your end? In case the filtering issue continues to persist, please modify the solution accordingly and send it back to us for an additional review. 

Regards,
Dimitar
Progress Telerik