I have to make a grid column filterable multi true but column is bind with List<string>. As per my knowledge it works for primitive data type. Action method contains sample dataset.
My requirement is Tags column should display each tag with comma separated and OS column should display with combination of package name and version.
Same as attached image grid.PNG
But my current code produce output like output.PNG
How can i achieve my desire result.
Please help.
Thanks in advance!!!
Here is my controller code:
public ActionResult GetComputers([DataSourceRequest]DataSourceRequest request)
{
List<string> tags1 = new List<string>();
tags1.Add("T1");
tags1.Add("T2");
tags1.Add("T3");
List<string> tags2 = new List<string>();
tags2.Add("T3");
tags2.Add("T2");
tags2.Add("T4");
List<string> tags3 = new List<string>();
tags3.Add("T1");
tags3.Add("T2");
tags3.Add("T4");
List<VarianProduct> prodcut1 = new List<VarianProduct>()
{
new VarianProduct(){Name = "Aria", Version = "12.2"},
new VarianProduct(){Name = "Eclipse", Version = "12.2"}
};
List<VarianProduct> prodcut2 = new List<VarianProduct>()
{
new VarianProduct(){Name = "Aria", Version = "12.2"},
new VarianProduct(){Name = "Eclipse", Version = "12.2"}
};
List<VarianProduct> prodcut3 = new List<VarianProduct>()
{
new VarianProduct(){Name = "Aria", Version = "12.2"},
new VarianProduct(){Name = "Eclipse", Version = "12.2"}
};
List<VarianProduct> prodcut4 = new List<VarianProduct>()
{
new VarianProduct(){Name = "Aria", Version = "12.2"},
new VarianProduct(){Name = "Eclipse", Version = "12.2"}
};
List<ComputerViewModel> list = new List<ComputerViewModel>()
{
new ComputerViewModel{Id = 1, HostName = "abc1", OS = "Windows xp", Tags = tags1, Products = prodcut1 },
new ComputerViewModel{Id = 2, HostName = "abc3", OS = "Windows xp", Tags = tags2, Products = prodcut2},
new ComputerViewModel{Id = 3, HostName = "abc2", OS = "Windows 7", Tags = tags3, Products = prodcut3},
new ComputerViewModel{Id = 4, HostName = "abc4", OS = "Windows 10", Tags = tags1, Products = prodcut4}
}
return Json(list.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
}
Here is my index.cshtm
@(Html.Kendo().Grid<ComputerViewModel>()
.Name("InventoryGrid")
.Columns(columns =>
{
columns.Bound(c => c.HostName).Filterable(ftb => ftb.Multi(true).Search(true));
columns.Bound(c => c.Tags).Template(@<text>@string.Join(", ", item.Tags)</text>).Filterable(ftb => ftb.Multi(true));
columns.Bound(c => c.OS);
columns.Bound(c => c.Products).Template(@<text> @string.Join(", ", item.Products.Select(p =>string.Join("-",p.Name, p.Version))) </text>);
}
)
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Read(read => read.Action("GetComputers", "RemoteDeployment"))
.ServerOperation(false)
)
.Filterable()
.Pageable()
.Navigatable()
.Sortable()
.HtmlAttributes(new {style="height:550px;"})
)