Hi,
I'm developing with Razor Pages and have a grid on a page that populates as I would like. However when I try to customize a dropdown editor for one of the columns, using a property from the Model, I fail to see anything in the resulting editor - I get a dropdown that seems empty even though I can verify the data is present.
For the purposes of testing, I have created a class and property on the .cs file. The contents are:
public class UserStatus
{
public int Status { get; set; }
public string StatusDescription { get; set; }
public string StatusCSSClass { get; set; }
}
public List Dropdown
{
get
{
return new List {
new UserStatus { Status = 1, StatusDescription= "Status 1", StatusCSSClass = "icon-s1" },
new UserStatus { Status = 2, StatusDescription = "Status 2", StatusCSSClass = "icon-s2" },
new UserStatus { Status = 3, StatusDescription = "Status 3", StatusCSSClass = "icon-s3" },
new UserStatus { Status = 4, StatusDescription = "Status 4", StatusCSSClass = "icon-s4" },
new UserStatus { Status = 5, StatusDescription = "Status 5", StatusCSSClass = "icon-s5" },
};
}
}
My .cshtml page has a variable declared like so:
var editParams = new { @params = new { dataSource = Model.Dropdown, fields = new { value = "StatusDescription" } } };
and my grid column looks like this:
e-grid-column field="StatusDescription" textAlign="Center" headerText="" editType="dropdownedit" edit="editParams" template="#statusTemplate"
Finally, for completeness, the template for this column looks like this:
Please advise where I am going wrong as I would expect to see a dropdown list with 5 entries.
If possible, please extend your reply to show how I could customize the dropdown list contents to show the span with a class of the StatusCSSClass and the StatusDescription next to it.
Your help is much appreciated.
I spotted a mistake in my edit parameters, which I have corrected. The above now works. I would still appreciate some help with customizing the look of the dropdown items, thanks.