Данные не применимы к динамически создаваемой таблице с использованием MVC - PullRequest
Новая
       8

Данные не применимы к динамически создаваемой таблице с использованием MVC

0 голосов
/ 05 ноября 2018

У меня проблема с датируемыми в приложении mvc. У mvc есть одна общая раскладка - главная страница ( Страница макета )

Я реализовал datatable обычно на главной странице ( Страница макета ), которая применяется ко всем дочерним страницам

Теперь я застрял с одной проблемой, которая заключается в том, что некоторые таблицы создаются динамически при выборе поля со списком

Страница макета 

$('.table').DataTable({
        "aoColumnDefs": [
                          {
                              bSortable: false,
                              aTargets: [-1], /* 1st one, start by the right */
                              "defaultContent": "",
                          }
        ],
        "fixedHeader": true,
        "lengthChange": false,
        "bPaginate": false,
        "responsive": true,
        "autoWidth": false,
        "scrollY": "300px",
        "scrollCollapse": true,
        "paging": false,
        initComplete: function (settings, json) {
            this.api().columns().header().each(function (th) {
                $(th).removeClass("sorting_asc");
                $(th).removeClass("sorting");
            }
         )
        },
    });

Ребенок (частичное представление) 

<div class="row">
                <div class="col-md-12">
                    <br />
                    <div id="example"></div>                        
                </div>
            </div>

function GetEmails() {
        var tbl = $('#example');
        $.ajax({
            url: '/test/GetTestData',
            contentType: 'application/html ; charset:utf-8',
            type: 'GET',
            dataType: 'html'
        }).success(function (result) {
            tbl.empty().append(result);                
        }).error(function (result) {
            alert("Fail");
        });
    }

Теперь у меня есть проблема, которая 

 tbl.empty().append(result);

после добавления таблицы в div, данные не применимы к этой таблице, мне интересно, как я могу уведомить на странице макета , что таблица добавляется в child page

Дайте мне знать, есть ли какие-либо события в javascript или jquery, которые запускаются после добавления или что-то в этом роде?

Заранее спасибо

Ответы [ 2 ]

0 голосов
/ 06 ноября 2018

Попробуй это, Его работает 

function ApplyDataTable()
{      
$('#example').bind('DOMNodeInserted', function (event) {
    if (event.type == 'DOMNodeInserted') 
    {
    //Datatable for search and sorting
    $(currntTable).DataTable({
    "aoColumnDefs": [
                      {
                          bSortable: false,
                          aTargets: [-1], /* 1st one, start by the right */
                          "defaultContent": "",
                      }
    ],
    "fixedHeader": true,
    "lengthChange": false,
    "bPaginate": false,
    "responsive": true,
    "autoWidth": false,
    "scrollY": "300px",
    "scrollCollapse": true,
    "paging": false,
    });      
    } 
});
}
0 голосов
/ 05 ноября 2018

Вы можете инициализировать datatable в случае успеха ajax примерно так: 

  $('.Table').DataTable();

Но если вы действительно хотите добавить данные из макета, это может быть полезно 

 $(document).ajaxComplete(function (event, xhr, settings) {
        $('.Table').DataTable();
    });
...