GridView с реализацией таблицы данных Jquery

Question

Недавно я пытался использовать функции "https://datatables.net" в одном рендере GridView. Это было невозможно, потому что рендеринг всегда дает таблицу без правильного форматирования (без thead). Есть ли способпреобразовать рендер в правильный формат?

Правильный формат:

<table id="table_id" class="display">
    <thead>
        <tr>
            <th>Column 1</th>
            <th>Column 2</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Row 1 Data 1</td>
            <td>Row 1 Data 2</td>
        </tr>
        <tr>
            <td>Row 2 Data 1</td>
            <td>Row 2 Data 2</td>
        </tr>
    </tbody>
</table>

Answer 1

Этот код форматирует одну таблицу в правильный формат, а затем запускает .DataTable(); в исправленной отформатированной таблице.

Чтобы использовать это, замените идентификатор вашей таблицы в '# gdVscQuote'

Если страница, на которой вы работаете, содержит более одной таблицы, это не будет работать, не будет проверено.

 $(document).ready( function () {
        //replace tr
        $($('#gdVscQuote')[0].childNodes[1].childNodes[0]).wrap('<thead/>').contents().unwrap();
        //replace all td with th inside thead
        $('thead td').wrap('<th/>').contents().unwrap();
        //get thead
        var thead = $("thead").get(0);
        //remove saved thead to replace above tbody thead
        $("thead").remove();
        //add thead correctly
        $('#gdVscQuote')[0].prepend(thead);
        // replace tds for tr
        $($('thead')[0].childNodes).wrapAll("<tr/>")
        //add jQuery table functionality
        $('#gdVscQuote').DataTable();
});