How to select all checkboxes when using Html.Awe().AjaxCheckboxList() control

Title:

BI{code} ?

We are using Html.Awe().AjaxCheckboxList() control on one of the grid column. We want to have a Select All or Sum Of All for the list of checkboxes. new Column { Bind = "SourceDisaggregates", Header = "Disag A" } .Mod(o => o.Inline(Html.Awe().AjaxCheckboxList("SelectedSourceDisaggregates").CssClass("awe-txt selectMaxWidth").Controller("Disaggregate").Action("GetChildDisaggregates").Parent("#PrefixSourceDisaggregateGroupID", "disaggregateGroupID").Area("SI"))), new Column { Bind = "TargetDisaggregateGroup", Header = "Disag Group B" } .Mod(o => o.Inline(Html.Awe().AjaxDropdown("TargetDisaggregateGroupID").CssClass("awe-txt selectMaxWidth").Controller("DisaggregateGroup").Action("GetDisaggregateGroups").Parent("#PrefixTargetIndicatorID", "indicatorID").Area("SI"))), Can you please point us to an example on how to achieve Select All functionality for each individual columns

Save Changes Cancel

Sridevi

asked at 30 Jul 2024

• there's a demo here for single checkboxlist, not inside the grid: https://demo.aspnetawesome.com/CheckboxList#Toggle-select-all In your case I don't exactly now the functionality you want to achieve, do you want a select all button inside each grid cell, or select all for all the grid rows at once
  at 30 Jul 2024 Omu
• select all button inside each grid cell
  at 30 Jul 2024 Sridevi

Answers

• BI{code} ?

  here's an example, having a column like this: new Column { Prop = "Meals", Header = "Meals", MinWidth = 200, Grow = 2.2 } .Inl("<button class='awe-btn btnCellSelectAll' type='button'>select all</button>") .Inl(Html.Awe().CheckBoxList(new CheckBoxListOpt { Name = "MealsIds", Url = Url.Action("GetMealsImg", "Data") }) you can add a js script for the select all button: <script> $(function () { $(document).on('click', '.btnCellSelectAll', function () { var cell = $(this).closest('td'); var field = cell.find('.o-ochk'); field.find(':checkbox').prop('checked', !field.find(':checkbox').first().prop('checked')).trigger('change'); }); }) </script>

  Save Changes Cancel

  

  Omu

  answered at 30 Jul 2024

please Sign In to leave an answer