Using a click handler within a template

[Thomas]

Hi
Is it possible to call a function defined outside the template? I have a grid where i need to get a value from the field caseid field and do a lot of stuff, depending on that id. I made a template with a button for each row, but I am not able to reach the function that should take care of the rest.
I am trying to do something like this, but it doesn´t work:

function showHistory(caseid){
// do a lot of stuff here
};
var btn_template = new kendo.template("<button id='#= caseid#' class='corr-button' onClick='showHistory(#= caseid#)'>show history</button>")

[sitefinitysteve]

 I'd do this instead (after your template finishes rendering)

$(".corr-button").click(function(){

   var caseid = $(this).attr("id");

   

   //Do something
    //showHistory(caseid);

});

[Brian]

To re-visit the original question, I am in a similar position but my class name is not known at design time so:

<input type='checkbox' class='cb cbCol" + property + "' name='" + property + "'></input>

Basically this is a kendo grid with dynamic columns.
In the header I want a check box that selects all checkboxes for that column in the grid itself.
One column header will have a style of .cbColXXX and the next will be .cbColYYY for example.

How can I attach an event to these checkboxes?

[Petyo]

Hello Brian,

 

the html element supports multiple classes - you can use a known one (or, any other selector, for that matter) to collect the checkboxes. Please notice that the case you describe is not specific to Kendo UI, so there are plenty of resources available on the topic. 

 

Regards,
Petyo
Telerik

 

 

[Brian]

Was it even worth responding?

For anybody who may have this same situation I worked it out days ago in the end:

template for the dynamic column:

headerTemplate: property + "<input type='checkbox' id='cbCol-" + property + "' class='chkbx' onchange='selectColumn(this);'></input>"

JavaScript:

function selectColumn(e) {
// select checkboxes with a class matching the id of the selected header checkbox
var name = '.' + e.id;
$('#divBrandReseedGrid').find(name).prop('checked', e.checked)
}