ASP.NET Core Datagrid Dialog Template Multiselect check boxes

Thread ID:	Created:	Updated:	Platform:	Replies:
147974	Sep 30,2019 12:57 PM UTC	Oct 1,2019 01:04 PM UTC	ASP.NET Core - EJ 2	1

Subscribe to this post

Tags: DataGrid

Chris

Asked On September 30, 2019 12:57 PM UTC

Hi,

I am trying to pre-select checkboxes in a dropdown list in an edit dialog box. I can't figure out how to check the boxes by sending data to it. In this example I want White and Purple to be selected. Thanks for your help! Here is my code:

DialogEditPartial:

<div>

<label asp-for="UserId" class="e-float-text e-label-top" >Order ID</label>

</div>

<ejs-numerictextbox id="FirstName" value=@Model.Firstname format="C2" placeholder="Freight" floatLabelType="Always" ></ejs-numerictextbox>

</div>

<ejs-datepicker id="LastName" value=@Model.Lastname placeholder="Order Date" floatLabelType="Always"></ejs-datepicker>

</div>

<ejs-multiselect id="Memberof" value="@ViewBag.groupchecked" dataSource="@ViewBag.groups" placeholder="Groups" floatLabelType="Always" popupHeight="300px" mode="CheckBox" >

<e-multiselect-fields text="Group" value="GroupVals" ></e-multiselect-fields>

</ejs-multiselect>

</div>

<textarea asp-for="Location">@Model.Location</textarea>

<label asp-for="Location" class="e-float-text e-label-top">Ship Address</label>

</div>

<ejs-scripts></ejs-scripts>

Controller:

public IActionResult EditPartial([FromBody] CRUDModel<HomeModel> value)

{

var data = Users.GetUsers(ViewBag.typedata, ViewBag.locationdata, ViewBag.gradedata);

ViewBag.datasource = data;

List<GroupList> Groups = new List<GroupList>();

ViewBag.groups = new UserGroups().GetUserGroups();

ViewBag.groupchecked = new string[] { "White", "Purple" };

return PartialView("_DialogEditPartial", value.Value);

}

Model:

namespace UserManagement.Models

{

public class UserGroups

{

public string Group { get; set; }

public string GroupDN { get; set; }

public bool isSelected { get; set; }

public List<UserGroups> GetUserGroups()

{

List<UserGroups> groups = new List<UserGroups>();

groups.Add(new UserGroups { Group = "Red", GroupVals = "0" });

groups.Add(new UserGroups { Group = "Blue", GroupVals = "1" });

groups.Add(new UserGroups { Group = "Green", GroupVals = "2" });

groups.Add(new UserGroups { Group = "Pink", GroupVals = "3" });

groups.Add(new UserGroups { Group = "Black", GroupVals = "4" });

groups.Add(new UserGroups { Group = "White", GroupVals = "5" });

groups.Add(new UserGroups { Group = "Purple", GroupVals = "6" });

groups.Add(new UserGroups { Group = "Green", GroupVals = "7" });

groups.Add(new UserGroups { Group = "Yellow", GroupVals = "8" });

return groups;

}

Reply | Reply with quote

Thavasianand Sankaranarayanan [Syncfusion]

Replied On October 1, 2019 01:04 PM UTC

Hi Chris,

Thanks for contacting Syncfusion support.

We have validated your query “ pre-select the checkboxes in a dropdown list in an edit dialog box” at our end.

By Default, Multiselect dropdown should map to its field and value has same like below code block .

Here , In Multiselect filed value as mapped to GroupVals, So you have to assign corresponding Groupvals (like 5 and 6 ) to multiselect value field.

<div>

. . . .

<ejs-multiselect id="Memberof" value="@ViewBag.groupchecked" dataSource="@ViewBag.groups" . . . >

<e-multiselect-fields text="Group" value="GroupVals"></e-multiselect-fields>

</ejs-multiselect>

</div>

[Controller.cs]

ViewBag.groupchecked = new string[] { "White", "Purple" };

Your requirement you have to assign value instead of above like below

ViewBag.groupchecked = new string[] { "5", "6" };

[Model.cs]

. . . . .

groups.Add(new UserGroups { Group = "White", GroupVals = "5" });

groups.Add(new UserGroups { Group = "Purple", GroupVals = "6" });

. . . . . .

return groups;

Please check the above code and get back to us, if you require any further assistance on this.

Regards,

Thavasianand S.

Reply | Reply with quote

ASP.NET Core Datagrid Dialog Template Multiselect check boxes

Thread ID:

Created:

Updated:

Platform:

Replies:

Please sign in to access our forum

CONTACT US