Jquery Datatable в начальной загрузке Модальный Не перезагружается после модального закрытия - PullRequest
1 голос
/ 13 июня 2019

HI У меня есть таблица данных jquery в модале начальной загрузки, данные для модальной модели взяты из моего МОДЕЛИ класса, как,

<table id="demoGrid1" class="table table-striped table-bordered dt-responsive" >  
                <thead>  
              <tr>  
                <th > Code</th>  
                <th>Description</th>      
                <th>Unit</th>  
                <th style="visibility:hidden"> Price</th>
                  <th style="visibility:hidden"> Color</th>
            </tr>  
                </thead>  
              <tbody>
                  @foreach (var item in Model)
                  {
                      <tr>
                          <td>@item.StockCode</td>
                          <td>@item.Description</td>
                          <td>@item.Unit</td>
                          <td style="visibility:hidden">@item.Price</td>
                          <td style="visibility:hidden">@item.Color</td>
                      </tr>
                  }
              </tbody>
            </table> 

звоню этой модели по

 $('#myModal').modal('show');

и скрываюсь, как только выбор сделан

$('#myModal').modal('hide');

Моя проблема, когда я делаю выбор в таблице данных, применяю некоторые стили и все, что не очищается, когда я снова закрываю и открываю всплывающее окно. Выборы и стили остаются неизменными даже после того, как я снова открываю свою модель.

Я пытался

$("#myModal").on("hidden.bs.modal", function () {

        $('#demoGrid1').DataTable().draw();
    });

перерисовать данные, но не получилось. Пожалуйста, помогите мне в этом, ребята. Как перерисовать данные в модальном всплывающем окне со значениями по умолчанию.

1 Ответ

0 голосов
/ 13 июня 2019

Вы можете использовать метод destroy(), чтобы удалить функции расширений DataTables и вернуть таблицу в исходное необработанное состояние с данными в таблице.

$("#myModal").on("hidden.bs.modal", function () {
           var table = $('#demoGrid1').DataTable();
           table.destroy();
           $('#demoGrid1').empty(); // empty in case the columns change
           $('#demoGrid1').DataTable();
    });
...