Sriks
Sriks

Reputation: 1699

Using HTML table datasource to be the same for kendo grid

I have a html table which populates with dynamic data, I want the same to be converted into Kendo Grid.

HTML Table:

<table>
   <thead>
   <tr>
     <th>Dynamic Column1 </th>
     <th>Dynamic Column2 </th>
     <th>Dynamic Column3 </th>
   </tr>
   </thead>
   <tbody>
   <tr>
     <td>Row 1 Cell 1</td>     
     <td>Row 1 Cell 2</td>     
     <td>Row 1 Cell 3</td>     
   </tr>
   <tr>
     <td>Row 2 Cell 1</td>     
     <td>Row 2 Cell 2</td>     
     <td>Row 2 Cell 3</td>     
   </tr>
   </tbody>
</table>

When I convert this table into Kendo Grid using the below code:

$("table").kendoGrid({resizable: true});

The data is getting repeated in row1 all columns, similarly for the other rows like:

enter image description here

All other grids in my application are KendoGrids. 2 to 3 grids I implemented as HTML tables as each of these cells are different partial views. (I have different partial views for boolean, Drodown, Text, datepicker, so I will be redirecting to respective partial views based on the input). I didn't get a solution to have these partial views inside .

Can some one guide how to convert this dynamic html table into KendoGrid with the same datasource? or it will be helpful if you can let me know how to bind partialviews in kendo grid MVC (using clientTemplate)?

Upvotes: 1

Views: 2271

Answers (1)

Fruitbat
Fruitbat

Reputation: 774

The javascript posted

$("table").kendoGrid({resizable: true});

should work.

Perhaps this is a timing issue? Have you tried something like this:

$( document ).ready(function() {
    $("table").kendoGrid({resizable: true});
});

If you want a more direct solution (i.e. kendo grid directly from datasource rather than applied to generated table) then you need to explain more on how the dynamic table is generated.

Upvotes: 0

Related Questions