title: Trigger event on clicking both on checkbox or row in kendo UI grid
body: <p>My kendo grid looks like:</p>
  
  <p><a href="https://i.stack.imgur.com/9bWIQ.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/9bWIQ.png" alt="enter image description here"></a></p>
  
  <p>I have <code>change/dataBound</code> methods used to both check the box and highlight selected row:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>change: function (e) {
      $('tr').find('[type=checkbox]').prop('checked', false).removeAttr('aria-selected');
      $('tr.k-state-selected').find('[type=checkbox]').prop('checked', true);                 
  },
  dataBound: function (e) {
      $(".checkbox").bind("click", function (e) {
          $(e.target).closest("tr").toggleClass("k-state-selected");
      });
  },</code></pre>
  </div>
  </div>
  </p>
  
  <p>I need to get data when one row is selected, and I can do it in <code>change</code> method by extracting <code>dataItem</code> from selected row. Problem is, <code>change</code> method is triggered only when I click on whole row, but not when I click on checkbox. How can I trigger event on both clicking on checkbox or row?</p>