I want to add a button in a Kendo UI grid which will redirect to a different site the URL is created dynamically in a function based on the environment and a ID field for that respective row is passed in the URL. So I added a command column in the grid but I am not sure how to pass the ID to that function . Please help . Below is not working for me
{ command: { text: "View", click: "getredirectURL(#=Id#)" }, title: " ", width: "100px" }
The problem is that you are configuring the click
event wrong. As per the documentation, you need to set the JavaScript function which gets executed when the command button is clicked. You cannot set the parameters of this function using templating (i.e. #=Id#
). The function receives a jQuery Event as an argument (copy-paste statement).
You need to do the following:
click: function(e) {
// e.target is the DOM element representing the button
var tr = $(e.target).closest("tr"); // get the current table row (tr)
// get the data bound to the current table row
var data = this.dataItem(tr);
//the "data" variable is now the entire "object" and has properties
//you now have access to the Id property so just call your function
getredirectURL(data.Id);
}
You might want to add a debugger;
and start inspecting the e
event and the this
object inside the function. There are many interesting things inside.