When a CheckboxGroup is included in an HTML form, the built-in reset function does not work for the checkbox group, unlike the individual checkboxes, as demonstrated in the following link: https://dojo.telerik.com/ureSOHoB.
(Before getting into the article, I apologize for my poor English skills.)
Hello! you guys always help me.
I need to create checkboxes using kendoCheckBoxGroup function in specific fields of KendoForm.
However, it should be limited to 4 per line, not listed in one line.
Expressing it pictorially is as follows:
(Note, the text that goes into the field will vary in length.)
And, the code I'm working on is below.
var items = [
{value: "item1", label: "Item 1"},
{value: "item2", label: "Item 2"},
{value: "item3", label: "Item 3"},
...
{value: "item14", label: "Item 14"},
];
$('#checkBoxField').kendoCheckBoxGroup({
items: items,
layout: "horizontal"
});
How can I modify it to make it work the way I want?
Thank you as always for your kindness!
Update
This should be a UI for ASP.NET Core question, so I Reposted it here
Scenario:
I am trying to enable and disable CheckBoxGroup items,
and it dependes on whether if the categories of the item has values.
For example, If there are two categorie, which are animals and fruits.
If I recieved no datas of fruits, I'll disabled the CheckBoxGroup item "fruits".
What I've tried so far
I search through documents and found this tutorial of the BindTo() method,
However, I got an error message saying "Cannot convert from System.Collections.Generic.List<MyCheckBoxItemModel> to string []
Questions
1. According to the method, how can I convert List<model> to string[] in my .cshtml ?
2. (Extension Question) In the tutorial, I'm awared that in the "InputGroupItemModel" there was a "Enabled" attribute.
Is it mean that if passed it to the front end and attached it with the BindTo() method, the CheckBoxGroup will automatically enable or disable the checkbox item?
(I'll show my code below)
Code
CheckBoxItemDto.cs
public class CheckBoxItemDto
{
//public IDictionary<string, object> HtmlAttributes { get; set; }
//public string CssClass { get; set; }
public bool? Enabled { get; set; }
//public bool? Encoded { get; set; }
public string Label { get; set; }
public string Value { get; set; }
}
CheckBoxItemViewModel.cs
public class CheckBoxItemViewModel
{
public List<CheckBoxItemDto> Items { get; set; }
public string[] CheckBoxGroupValue { get; set; }
}
MyViewModel.cs
public class EqInstsDataViewModel
{
public IEnumerable<MyOtherViewModel> MyOtherViewModel { get; set; }
public CheckBoxItemViewModel CheckBoxItemViewModel { get; set; }
}
Controller
public IActionResult GetChartPartialView()
{
try
{
List<CheckBoxItemDto> checkBoxItemDto = GetCheckBoxItem(); //Get CheckBox Items
CheckBoxItemViewModel checkBoxItem = new CheckBoxItemViewModel() { Items = checkBoxItemDto };
MyViewModel myViewModel = new MyViewModel() { Items = checkBoxItem }
return PartialView("~/Views/Shared/_MyPartialView.cshtml", myViewModel);
}
catch (Exception ex)
{
return Json(ex.Message);
}
}
public List<CheckBoxItem> GetCheckBoxItem()
{
try
{
#region CheckBoxItems
var itemsList = new List<CheckBoxItemDto>()
{
new CheckBoxItemDto()
{
Label = "Animals",
Value = "1",
Enabled = true
},
new CheckBoxItemDto()
{
Label = "Friuts",
Value = "2",
Enabled = false
} ,
};
#endregion
return itemList;
}
catch(Exception)
{
throw;
}
}
_MyPartialView.cshtml
@(Html.Kendo().CheckBoxGroup()
.Name("MyCheckBox")
.BindTo(Model.CheckBoxItemViewModel.Items) //Cannot convert from List<CheckBoxItemDto> to string[]
.Value(Model.CheckBoxItemViewModel.CheckBoxGroupValue)
.Layout("horizontal")
)
on change event - unable to fetch selected values.
Please advise.
<script>
$(document).ready(function () {
$("#chk").kendoCheckBoxGroup({
layout: "vertical",
autoBind: false,
items: ["item 1", "item 2", "item 3"],
change: function (e) {
chkChanged();
}
});
});
chkChanged = function () {
debugger;
var displaynames = $("#chk").kendoCheckBoxGroup().data("kendoCheckBoxGroup");
var value = displaynames.value().join(",");
console.log(value)
}
</script>
Hi,
Need customization of Checkboxes on focus need to add arrow showing below options.
Currently having close ( X ) icon. Need to be add down arrow as per attachment design.
Please assist.
hello everyone
i have a checkbox group inside a form
when ever i clear the form with form.clear or even with the default clear button of the form , the value attribute of checkbox become empty and from that time i can not work with items of checkboxgroup with theirs value.
is there any one can help me?