title: How to bind a Kendo Grid on a button click event
body: <p>I have to bind a kendo grid on button click and got the example in another SO question: <a href="https://stackoverflow.com/questions/19261998/kendo-grid-bind-data-after-search">Kendo Grid - Bind Data After Search</a> , but this is not working for me. My controller action is returning the json object but that object is not getting mapped to my grid.</p>
  
  <p>The following is the same code presented in the other question:</p>
  
  <pre><code>@(Html.Kendo().Grid&lt;Project.Data.Entity.SearchResult&gt;()
     .Name("ClaimantSearch") 
     .DataSource(dataSource =&gt; dataSource 
          .Ajax() 
      //.Read(read =&gt; read.Action("Search", "Claimant")) ) 
     .Columns(columns =&gt; 
     { 
      columns.Bound(x =&gt; x.Name); 
      columns.Bound(x =&gt; x.Authorized); 
      columns.Bound(x =&gt; x.CompanyName); 
      columns.Bound(x =&gt; x.Address); 
      }) 
     .Resizable(resizing =&gt; resizing.Columns(true))
  )
  </code></pre>
  
  <p>Javascript:</p>
  
  <pre><code>$('#btnSearch').click(function () {
      alert('a');
      $.ajax({
          data: '@Url.Action("Search", "Claimant")',
          type: 'POST',
          contentType: "application/json;charset=utf-8",
          data: "",
          dataType: "json",
          success: function (data) {
              alert(data);
              var grid = $('#Claimant').getKendoGrid();
              grid.dataSource.data(result);
              grid.refresh();
          }
      });
      return false;
  });
  </code></pre>