I am trying to implement a Grid with a Dropdownlist as custom Editor Template. The list items in Dropdownlist should be based on value from Grid row.
My Grid is like this.
@(Html.Kendo().Grid<GridViewModel>()
.Name("grid-results")
.Sortable()
.Groupable()
.Columns(columns =>
{
columns.Bound(p => p.Id).Hidden().Groupable(false);
columns.Bound(p => p.Total)
.ClientFooterTemplate("Grand Total: #=kendo.toString(sum, 'C4')#")
.FooterHtmlAttributes(new { style = "font-weight:bold; text-align:right;" })
.HtmlAttributes(new { style = "text-align:right" });
columns.Bound(p => p.StatusId ).Title("Resolution Status")
.ClientTemplate("#=StatusName#")
============> .EditorViewData(new { statusId = "#=StatusId #" })
.EditorTemplateName("StatusList"); // file name
columns.Bound(p => p.User);
})
.Pageable(paging => paging
.Info(false)
.Input(true)
.Numeric(false)
.PageSizes(new Int32[] { 5, 10, 20 })
)
.Editable(editable =>
{
editable.Mode(GridEditMode.InCell);
})
.Resizable(configurator => configurator.Columns(true))
.DataSource(dataSource => dataSource
.Ajax()
.ServerOperation(true)
.Read(read =>
{
read.Action("GetResults", "Home").Data("onFilterSelection");
})
.PageSize(10)
.Model(model =>
{
model.Id(p => p.PoId);
model.Field(p => p.Total).Editable(false);
model.Field(p => p.StatusId ).Editable(true);
model.Field(p => p.User).Editable(false);
})
.Aggregates(aggregates =>
{
aggregates.Add(p => p.Total).Sum();
})
)
)
editor template is like
@(Html.Kendo().DropDownList()
.Name(ViewData.TemplateInfo.GetFullHtmlFieldName(string.Empty))
.DataValueField("ListStatusId")
.DataTextField("ListStatusName")
.DataSource(dataSource =>
{
dataSource.Read(read =>
{
read.Action("GetStatusList", "Home", new { statusId = ViewData["statusId"] });
});
})
)
Controller Action:
public JsonResult GetCustomizeResolutionStatusList(string statusId)
{
List<StatusModel> status = new List<StatusModel>();
// code to get list of StatusModel based on statusId
return status ;
}
GridViewModel
public class GridViewModel
{
public int Id { get; set; }
public decimal Total { get; set; }
public short StatusId { get; set; }
public string StatusName { get; set; }
public string User{ get; set; }
}
StatusModel
public class StatusModel
{
public int ListStatusId { get; set; }
public String ListStatusName { get; set; }
}
I tried to use .EditorViewData(new { statusId = "#=StatusId #" }) to pass GridViewModel.StatusId to dropdownlist editor template. But it doesn't work.
I can't use Model.StatusId since the page level view model is different from Grid view model.
Can someone please help me with this?
Thanks.
My Grid is like this.
@(Html.Kendo().Grid<GridViewModel>()
.Name("grid-results")
.Sortable()
.Groupable()
.Columns(columns =>
{
columns.Bound(p => p.Id).Hidden().Groupable(false);
columns.Bound(p => p.Total)
.ClientFooterTemplate("Grand Total: #=kendo.toString(sum, 'C4')#")
.FooterHtmlAttributes(new { style = "font-weight:bold; text-align:right;" })
.HtmlAttributes(new { style = "text-align:right" });
columns.Bound(p => p.StatusId ).Title("Resolution Status")
.ClientTemplate("#=StatusName#")
============> .EditorViewData(new { statusId = "#=StatusId #" })
.EditorTemplateName("StatusList"); // file name
columns.Bound(p => p.User);
})
.Pageable(paging => paging
.Info(false)
.Input(true)
.Numeric(false)
.PageSizes(new Int32[] { 5, 10, 20 })
)
.Editable(editable =>
{
editable.Mode(GridEditMode.InCell);
})
.Resizable(configurator => configurator.Columns(true))
.DataSource(dataSource => dataSource
.Ajax()
.ServerOperation(true)
.Read(read =>
{
read.Action("GetResults", "Home").Data("onFilterSelection");
})
.PageSize(10)
.Model(model =>
{
model.Id(p => p.PoId);
model.Field(p => p.Total).Editable(false);
model.Field(p => p.StatusId ).Editable(true);
model.Field(p => p.User).Editable(false);
})
.Aggregates(aggregates =>
{
aggregates.Add(p => p.Total).Sum();
})
)
)
editor template is like
@(Html.Kendo().DropDownList()
.Name(ViewData.TemplateInfo.GetFullHtmlFieldName(string.Empty))
.DataValueField("ListStatusId")
.DataTextField("ListStatusName")
.DataSource(dataSource =>
{
dataSource.Read(read =>
{
read.Action("GetStatusList", "Home", new { statusId = ViewData["statusId"] });
});
})
)
Controller Action:
public JsonResult GetCustomizeResolutionStatusList(string statusId)
{
List<StatusModel> status = new List<StatusModel>();
// code to get list of StatusModel based on statusId
return status ;
}
GridViewModel
public class GridViewModel
{
public int Id { get; set; }
public decimal Total { get; set; }
public short StatusId { get; set; }
public string StatusName { get; set; }
public string User{ get; set; }
}
StatusModel
public class StatusModel
{
public int ListStatusId { get; set; }
public String ListStatusName { get; set; }
}
I tried to use .EditorViewData(new { statusId = "#=StatusId #" }) to pass GridViewModel.StatusId to dropdownlist editor template. But it doesn't work.
I can't use Model.StatusId since the page level view model is different from Grid view model.
Can someone please help me with this?
Thanks.