Я загружаю cshtml в свой проект .net через ajax, после того, как успешно связал данные с dom, инициализирую данные на нем с возможностью экспорта в Excel,
, но когда вы выбираете данные более чем раз (пользовательиспользуя файлеры), datatable является обязательным (добавляющим) событием для кнопки экспорта каждый раз, и пользователь заканчивает тем, что загружает сразу несколько файлов Excel.
Я повторил метод cshtml
и ajax
с data
иgetCSHTML
методов.
Действия по воспроизведению проблемы.
- Нажмите кнопку Получить данные .
- Нажмите Экспорт данныхКнопка (будет загружен только один файл).
- Вернитесь к шагу 1 и 2, повторите его, не обновляя вкладку браузера, в итоге вы скачаете несколько файлов Excel одним щелчком мыши.
Я пробовал, .off()
, .unbind()
и .bind()
, но без помощи.
var data = '<table id="example"><thead><tr><th>Name</th><th>Position</th><th>Office</th><th>Age</th><th>Start date</th></tr></thead><tbody><tr><td>Airi Satou</td><td>Accountant</td><td>Tokyo</td><td>33</td><td>2008/11/28</td></tr><tr><td>Angelica Ramos</td><td>Chief Executive Officer (CEO)</td><td>London</td><td>47</td><td>2009/10/09</td></tr><tr><td>Ashton Cox</td><td>Junior Technical Author</td><td>San Francisco</td><td>66</td><td>2009/01/12</td></tr><tr><td>Bradley Greer</td><td>Software Engineer</td><td>London</td><td>41</td><td>2012/10/13</td></tr><tr><td>Brenden Wagner</td><td>Software Engineer</td><td>San Francisco</td><td>28</td><td>2011/06/07</td></tr><tr><td>Brielle Williamson</td><td>Integration Specialist</td><td>New York</td><td>61</td><td>2012/12/02</td></tr><tr><td>Bruno Nash</td><td>Software Engineer</td><td>London</td><td>38</td><td>2011/05/03</td></tr><tr><td>Caesar Vance</td><td>Pre-Sales Support</td><td>New York</td><td>21</td><td>2011/12/12</td></tr><tr><td>Cara Stevens</td><td>Sales Assistant</td><td>New York</td><td>46</td><td>2011/12/06</td></tr><tr><td>Cedric Kelly</td><td>Senior Javascript Developer</td><td>Edinburgh</td><td>22</td><td>2012/03/29</td></tr></tbody></table>'
function getCSHTML() {
$("#masterPage").html(data);
$('#example').DataTable({
dom: 'Bfrtip',
buttons: [
'copy', 'csv', 'excel', 'pdf', 'print'
],
"initComplete": function() {
var $buttons = $('.dt-buttons').hide();
if ($('#exportLink').length > 0) {
$('#exportLink').on('change', function() {
var btnClass = $(this).find(":selected")[0].id ?
'.buttons-' + $(this).find(":selected")[0].id :
null;
if (btnClass) $buttons.find(btnClass).click();
})
}
$('#exportToExcel').on('click', function() {
$('.buttons-excel').click()
})
},
});
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">
<script src="https://cdn.datatables.net/buttons/1.5.2/js/dataTables.buttons.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.5.2/js/buttons.flash.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/pdfmake.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/vfs_fonts.js"></script>
<script src="https://cdn.datatables.net/buttons/1.5.2/js/buttons.html5.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.5.2/js/buttons.print.min.js"></script>
<button onclick="getCSHTML()">Get Data</button>
<button id="exportToExcel">Export Data</button>
<div id="masterPage"></div>