OpenStack
OpenStack

Reputation: 5596

Unable to redirect and call a function when clicked on hyperlink

I have setup a kendo grid. The gird has a column containing a hyperlink. When I click on the link, I need to call a function and then I need to redirect to a new page. I know it sounds simple. I have a stand alone example which is doing same.

But when I try to use same logic in kendo grid, I am unable to get the desired result. Please help. Here is a link to Kendo Grid with a column containing hyperlink.

$('#one').kendoGrid({
  dataSource: dataOne,
  columns: [{
    field: 'a',
    template: "<a onclick=return doWork() href='/home/again/${a}'>${a}</a>"
  }, {
    command: 'destroy'
  }],
  editable: {
    confirmation: false
  }
});

Upvotes: 0

Views: 345

Answers (2)

Avijit
Avijit

Reputation: 1313

You need prevent the default click by event.preventDefault() and then redirect.

$('#one').kendoGrid({
  dataSource: dataOne,
  columns: [{
    field: 'a',
    template: "<a onclick=\"doWork(event, '/home/again/${a}')\" href=''>${a}</a>"
  }, {
    command: 'destroy'
  }],
  editable: {
    confirmation: false
  }
});

function doWork(ev, url){
   ev.preventDefault();
   alert("redirecting");
   //... do your works
   window.location.href = url;
}

Upvotes: 0

SharpCoder
SharpCoder

Reputation: 19163

try this soution

Add this function before grid settings:

function showFoo() {
  alert('I am foo!');
  return true;
}

Add following code at the end (after grid settings).

var el = document.getElementById('foo');
el.onclick = showFoo;

Upvotes: 1

Related Questions