Kendo事件的使用

 

.Events(events=>events.Change("SelectChange") )

绑定点击事件

function SelectChange (e) {

if (this.select().find('input[type=checkbox]').attr('checked')) {

this.select().find('input[type=checkbox]').removeAttr('checked');

} else {

this.select().find('input[type=checkbox]').attr('checked', 'true');

}

}

注解：e参数为grid，选中的行为e.select()或者grid.select()

 

 

Kendo内部按钮事件及获取行值

columns.Bound(o => o.AFFIX_ID).Title("操作")

.ClientTemplate(

"<a class=\"k-button\" href=\"JavaScript:void(0)\" οnclick=\"editInfo('#=AFFIX_ID #');\" style=\"display:" + editState + "\">" +

)

function editInfo(selectedRowId) {

gridSelectById('mainGrid', selectedRowId);//内置函数，通过ID选中这一行

var grid = $("#mainGrid").data("kendoGrid");

var row = grid.select();//得到选中行

var rowData = grid.dataItem(row);//得到选中行数据

strOperType = "Update";

strInviteID = selectedRowId;

 

//开始绑定edit数据

var DataForm = $("#QuickAddWrapper");

DataForm.find("#edit_Affix_id").val(rowData.AFFIX_ID);}

 

绑定非内置常用事件如双击事件

function SelectChange(e) {//内置单击

var grid = $("#mainGrid").data("kendoGrid");

var rowData = grid.dataItem(this.select());//得到选中行数据

this.expandRow($('[data-uid=' + rowData.uid + ']'));

}

$("#mainGrid").on("dblclick", "tr.k-state-selected", function () {//双击绑定

var grid = $("#mainGrid").data("kendoGrid");

var rowData = grid.dataItem(grid.select());//得到选中行数据

grid.expandRow($('[data-uid=' + rowData.uid + ']'));

})

折叠展开事件的代码

 

//展开详细折叠区域

function onDetailsExpand(e) {

//改变折叠区域样式

$(e.masterRow.find(".k-hierarchy-cell")).addClass("expanded-hierarchy-cell");

$(e.detailRow.find(".k-hierarchy-cell")).addClass("expanded-hierarchy-cell");

$(e.detailRow.find(".k-detail-cell")).addClass("expanded-hierarchy-cell");

//收起其他的行

this.collapseRow(this.tbody.find(' > tr.k-master-row').not(e.masterRow));

}

//收起折叠区域

function onDetailCollapse(e) {

$(e.masterRow.find(".k-hierarchy-cell")).removeClass("expanded-hierarchy-cell");

$(e.detailRow.find(".k-hierarchy-cell")).removeClass("expanded-hierarchy-cell");

$(e.detailRow.find(".k-detail-cell")).removeClass("expanded-hierarchy-cell");

}