Post data back to controller in List<SomeClass>

[Ravinder]

Hi,
I am new to Kendo UI widgets and MVC4. I am using Razor View. I have a model Called Project. I have another model called Location. In Project model there is a property "List<LocationType> Locations". 

On my razor form i have "@model Model.Project" and one of my multiselect widget shows me location list. I have declared it "@(Html.Kendo().MultiSelectFor(model => model.LocanTypes)". Now when I try to get "Project.Locations" in controller in [HttpPost] action I get Project.Locations as null.

Model declaration on Razor Page: 
@model PestPec.Models.Project 

Multiselect declartion of Multiselect:
@(Html.Kendo().MultiSelectFor(model => model.LocanTypes)
                        .Name("LocationTypesMultiSelect")
                        .Placeholder("Select Location Type(s)")
                        .DataTextField("Name")
                        .DataValueField("ID")
                        .Filter(FilterType.Contains)
                        .DataSource(source =>
                        {
                            source.Read(read =>
                            {
                                read.Action("GetLocatinTypes", "Project");
                            });
                        }) 
                    ) 

Project.cs:
 public class Project
    {
        public int ID { get; set; }
        public string Name { get; set; }
        public int Type { get; set; }
        public string CreatedBy { get; set; }
        public List<Technician> Technicians{get; set;}
        public List<Route> Routes { get; set; }
        public List<ProjService> Services { get; set; }
        public List<Division> Divisions { get; set; }
        public List<Branch> Branches { get; set; }
        public List<LocationType> LocanTypes { get; set; }
        public String Country { get; set; }
        public String City { get; set; }

        [DisplayFormat(DataFormatString = "{0:MM/dd/yy}")]
        public DateTime CreatedDate { get; set; }

        [DisplayFormat(DataFormatString = "{0:MM/dd/yy}")]
        public DateTime LastUpdatedDate { get; set; }
    }

LocationType:
public class LocationType
    {
        public int ID { get; set; }
        public string Name { get; set; }
    }

[Ravinder]

Will Someone Please reply me.

[Alexander Popov]

Hello Ravinder,

This could happen in case the MultiSelect's widget name is different from the name of the Model's property. Basically, all For helpers are applying a name attribute to their input element equal to the model's property they are used for. This means that setting a name manually is rarely needed, and in this case I would recommend removing it. 

Regards,
Alexander Popov
Telerik

 

 

[Ravinder]

Thanks for your reply. I implement suggested change and getting model property list empty instead of null. Here is my Grid:

@(Html.Kendo().MultiSelectFor(model => model.Technicians)
                            .Placeholder("Select Technician(s)")
                            .DataTextField("Name")
                            .DataValueField("ID")
                            .Filter(FilterType.Contains)
                            .AutoBind(true)
                            .DataSource(source =>
                            {
                                source.Read(read =>
                                {
                                    read.Action("GetTechnicians", "Project");
                                })
                                .ServerFiltering(false);
                            })          
                        )
                        .BindTo(Model.Technicians)  /* This line is not making any change */

Please suggest its urgent.

[Alexander Popov]

Hello again Ravinder,

How are the items passed to the controller? In case you are using a form then you will need a custom solution that uses the form's submit event to create hidden input elements corresponding to the item's fields. In case you are using Ajax requests you could use the following approach: 

$("#sendButton").click(function () {
    $.ajax({
        url: "urlToControllerAction",
        type: "POST",
        dataType: "json",
        contentType: "application/json",
        data: JSON.stringify({ Technicians: $("#Technicians").data("kendoMultiSelect").dataItems() })
    })
});

In case the above does not answer your question I would ask you to share additional information about your setup, so we can advise you further.

Regards,
Alexander Popov
Telerik