Как выбрать все флажки в Jquery, используя шаблон заголовка кендо?
Я все еще новичок в кодировании и только начал javascript около месяца назад. Извините за непонятный код. Любая помощь будет мне очень признательна. Спасибо..
Итак, у меня есть сетка кендо, которую я использую с бритвой и mvc. Мне также нужно будет связать галочку и изменения строки, чтобы он обновил мой раскрывающийся список (CustomerServiceCustomerCodeList)... но я попытаюсь понять эту часть, когда доберусь туда... Прежде всего, что более важно, мне нужно получить кнопка выбрать все работает правильно. Мои флажки установлены с шаблоном клиента и шаблоном заголовка. Мне нужно выяснить, как выбрать все галочки в моей части шаблона заголовка сетки с помощью jquery. Шаблон клиента проверяет код отдельных ящиков, но не проверяет все. Я пробовал сотни различных подходов и не могу заставить его работать. Пожалуйста помоги.
Сетка кендо:
@model IEnumerable<MyEntity.Shipment.ShipmentServiceLevel>
@{
var userCustomerCode = HttpContext.Current.Session["ServiceLevelCustomerCode"];
}
@(Html.Kendo().Grid(Model)
.Name("ServiceLevelGrid")
.Reorderable(reorder => reorder.Columns(true))
.Columns(columns =>
{
columns.Bound(s => s.IsSelected).Template(@<text></text>)
.HeaderTemplate("<input type='checkbox' class='chkbx k-checkbox' id='selectAllCheck' />")
.ClientTemplate("<input type='checkbox' id='eachCheckbox' class='chkbxq k-checkbox' />")
.Sortable(false)
.Filterable(false)
.Width(40);
columns.Bound(s => s.ServiceLevelCode).Title("Code").Width(73);
columns.Bound(s => s.ServiceLevelDescription);
columns.Command(command => { command.Edit();}).Width(77);
})
.Sortable()
.Scrollable()
//.Editable(ed => ed.Mode(GridEditMode.InCell))
.Selectable(s => s
.Type(GridSelectionType.Row)
.Mode(GridSelectionMode.Multiple)
)
.PersistSelection(false)
.HtmlAttributes(new { style = "min-height:280px; height:280px;", id = "ServiceLevelGrid" })
.DataSource(dataSource =>
{
dataSource
.Ajax()
//.Events(ev =>
//{
// //ev.Change("CustomServiceLevel_DataSourceChange");
// //ev.Edit("CustomServiceLevelEdit");
// ev.Save("CustomServiceLevelSave");
// //ev.Sync("resyncChildGrid");
// //ev.RequestEnd("AddressBook_requestEnd");
//})
.Model(model =>
{
model.Id(s => s.ServiceLevelCode);
model.Field(field => field.IsSelected).Editable(true);
model.Field(field => field.ServiceLevelCode).Editable(false);
model.Field(field => field.ServiceLevelCustomDescription).Editable(true);
})
.Batch(true)
.Update(update =>
{
update.Action("ServiceLevelGrid_Update", "UserAccount", new {Area = "Management", CustomerCode = userCustomerCode});
//update.Data("ServiceLevel_GetCustomList_Data");
})
.Read(read =>
{
read.Action("ServiceLevelGrid_Read", "UserAccount", new {Area = "Management", CustomerCode = userCustomerCode});
//read.Data("ServiceLevel_GetCustomList_Data");
});
})
)
@*.Events(ev => ev.DataBound("CustomServiceLevelGrid_DataBound"))*@
Вот мой Jquery.
debugger;
//customer code dropdown list bind to grid
function ServiceLevel_GetCustomList_Data(event) {
var customServiceCustomerCodeList = $("#CustomServiceCustomerCodeList").data("kendoDropDownList"),
customServiceCustomerCodeList_DataItem = customServiceCustomerCodeList.dataItem(),
customServiceCustomerCodeList_ItemValue = customServiceCustomerCodeList_DataItem["OrganizationCode"];
var customServiceDataModel = {
customerCode: customServiceCustomerCodeList_ItemValue
}
return customServiceDataModel;
};
//Checkbox grid
debugger;
console.log();
$('#ServiceLevelGrid').on("click", ".k-checkbox", function (e) {
grdChkBoxClick(e);
});
function grdChkBoxClick(e) {
var row = $(e.target).closest('tr');
grdChkBoxUpdate(row);
};
};
//individual check box select
function grdChkBoxUpdate(row) {
debugger;
console.log();
var grid = $("#ServiceLevelGrid").data("kendoGrid"),
dataItem = grid.items().length > 0 ? grid.dataItem(row) : undefined,
isItemChecked = ($("#eachCheckbox", row).prop("checked") === true);
debugger;
console.log();
if (isItemChecked) {
var isSelected = dataItem.IsSelected;
dataItem.dirty = true;
dataItem.IsSelected = true;
console.log("isSelected: " + isSelected);
} else {
dataItem.dirty = true;
dataItem.IsSelected = false;
}
}
function checkAll(row) {
$(".chkbxq").each(function () {
debugger;
console.log();
// handle the checkbox logic
// add logic to check if is checked or not and do proper handling based on that
$(this).attr('checked', row);
// update dataItem to reflect changes.... (update model and dirty flag)
grdChkBoxUpdate;
var row = $(e.target).closest('tr');
grdChkBoxUpdate(row);
});
}
function checkAll(row) {
$(".chkbxq").each(function () {
debugger;
console.log();
function sRow() {
var trLength = $("#ServiceLevelGrid .k - checkbox table tr").length;
if (trLength > 0) {
$("#ServiceLevelGrid .k - checkbox table tr").each(function(i) {
grdChkBoxUpdate(this);
});
}
}
var isSelected = $(".k-checkbox", "#ServiceLevelGrid thead").attr("aria-checked");
if (isSelected !== "true") {
$(".k-checkbox", "#ServiceLevelGrid thead").click();
}
$(this).attr('checked', row);
var row = $(e.target).closest('tr');
grdChkBoxUpdate(row);
});
}