- Home
- Forum
- ASP.NET MVC
- Multiselect DropDownList uncheckAll
Multiselect DropDownList uncheckAll
Hi Keerthana.
Thank you for the attached sample. In this sample uncheckAll work fine. But when I add data binding in your project - uncheckAll stop working.
Please look at screencast: https://www.screencast.com/t/NaNpaOtnaMbx
My changes :
DropDownlistFeatures.cshtml :
@using SyncfusionMvcApplication1
@model SyncfusionMvcApplication1.ViewModels.DropdownlistViewModel
@{
ViewBag.Title = "Dropdownlist";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<div id = "ControlRegion">
<div class="frame1">
<div class="control">
<div class="ctrllabel">
Select a car</div>
@Html.EJ().DropDownList("selectCar").Datasource(Model.ListItems).DropDownListFields(builder => builder.Value("Id").Text("Name")).ShowCheckbox().EnableRTL(false).Width("150px").HeaderTemplate("<div class='temp'><input id='check' type='checkbox'/></div>").ShowCheckbox(true).ClientSideEvents(clientEvent => clientEvent.Create("create")).MultiSelectMode(MultiSelectModeTypes.Delimiter)
</div>
<br/>
</div>
<script>
function create(args) {
$("#check").ejCheckBox({ text: "Check All", change: "Change" });
}
function Change(args) {
window.flag = true;
var obj = $("#selectCar").ejDropDownList("instance");
if (args.isChecked) obj.checkAll();
else obj.uncheckAll();
window.flag = false;
}
</script>
<br/><br/>
<style type="text/css" class="cssStyles">
.control
{
margin-left: 30px;
}
.ctrllabel
{
padding-top: 15px;
}
.temp {
height: 30px;
display: block;
padding-left: 13px;
padding-top: 5px;
border-bottom: 1px solid #c8c8c8;
}
.e-chkbox-wrap .e-text {
font-size: 14px;
padding-left: 10px;
}
</style>
</div>
Controller:
namespace SyncfusionMvcApplication1
{
public partial class DropdownlistController: Controller
{
public ActionResult DropdownlistFeatures()
{
var viewModel = new DropdownlistViewModel();
viewModel.ListItems = new List<Data>()
{
new Data(1, "Audi A4"),
new Data(2, "Audi A5"),
new Data(3, "Audi A6"),
new Data(4, "Audi A7"),
};
return View(viewModel);
}
}
}
Model:
public class DropdownlistViewModel
{
private List<Data> _listItems;
public List<Data> ListItems
{
get { return _listItems; }
set
{
_listItems = value;
}
}
}
public class Data
{
public Data(int id, string name)
{
Id = id;
Name = name;
}
public int Id { get; set; }
public string Name { get; set; }
}
|
public ActionResult DropdownlistFeatures()
{
var viewModel = new DropdownlistViewModel();
viewModel.ListItems = new List<Data>()
{
new Data("1", "Audi A4"),
new Data("2", "Audi A5"),
new Data("3", "Audi A6"),
new Data("4", "Audi A7"),
};
return View(viewModel);
}
}
public class Data
{
public Data(string id, string name)
{
Id = id;
Name = name;
}
public string Id { get; set; }
public string Name { get; set; }
}
|
Thank you for help. Now it's working.
Good day to you.
We have checked the reported issue by rendering DropDownList with 70 items. Check and Uncheck all option works fine in our end. We have prepared a live demo sample for your reference. Please refer to the below given link.
https://jsplayground.syncfusion.com/dv5n1isz
Could you please check the above sample and if issue persists, provide proper replication steps and issue replicable sample? so that we can proceed further on this.
Regards,
Vinoth Kumar S
- 7 Replies
- 4 Participants
-
RS Radoslaw Szuban
- Oct 25, 2017 09:50 AM UTC
- May 28, 2019 01:00 PM UTC
