Bootstrap-table: is there anyway, I can change file name while exporting table?

Created on 15 Jun 2015  路  19Comments  路  Source: wenzhixin/bootstrap-table

extension has PR help-wanted

Most helpful comment

Sorry to resurrect an old thread, but the link to the fiddle for exporting using filename via attribute seems to be broken in the docs: http://jsfiddle.net/marcelk/6gd9w79u/

Is there a new fiddle we can take a look at to determine how best to use this?

All 19 comments

Yes, you can set the exportOptions option:

exportOptions: {
    fileName: 'tableExport'
}

Can I use this export options using attribute this way?

data-export-options="{ fileName: 'myExportFileName' }" ?

Now the extension doesn't support data attribute.

writing the attribute like this in JSON format does seem to work (notice the single quotes). It probably gets parsed somewhere along the way:

<table data-toggle="table"
       data-show-export="true"
       data-export-options='{"fileName": "testo"}' >
</table>

can you help to add a jsfiddle example @marcel-k?

@simkeyur @wenzhixin

Sure here you go:

http://jsfiddle.net/marcelk/6gd9w79u/

Also added jspdf example, works in all browsers including internet explorer 10 and up.

Don't know if it's a good thing it works with the attribute the way it does though... Mabe it causes a security issue?

Thanks, added to #1765.

Is there anyway to add hidden column on exporting to csv. Like for ignoring column
ignoreColumn: [4,5,6], works.But is there any thing for adding column.

Current time as file name different time for every export.
I did

function date_call()
 {
     var d = new Date();
     var name= 'download'+d.getFullYear()+("00" + (d.getMonth() + 1)).slice(-2)+("00" + d.getDate()).slice(-2)+("00" + d.getHours()).slice(-2)+ ("00" + d.getMinutes()).slice(-2)+ ("00" + d.getSeconds()).slice(-2);
     return name;
 }
exportOptions: {
            "fileName": date_call(), 
        }

it only returns same time for all exports

How to update the filename dynamically?

@yuvarajjcse @maddy25
I solved it by modifying the source code.
First, I added "exportFileNameformater" in bootstrap-table-export.js.

$.extend($.fn.bootstrapTable.defaults, {
    showExport: false,

    //Added code
    exportFileNameFormater: function () {
        return undefined;
    },

    exportDataType: 'basic', // basic, all, selected
    // 'json', 'xml', 'png', 'csv', 'txt', 'sql', 'doc', 'excel', 'powerpoint', 'pdf'
    exportTypes: ['json', 'xml', 'csv', 'txt', 'sql', 'excel'],
    exportOptions: {}
});

Second,I added "that.options.exportOptions.fileName = that.options.exportFileNameFormater() || that.options.exportOptions.fileName;" in bootstrap-table-export.js.

 $menu.find('li').click(function () {
         var type = $(this).data('type'),
                doExport = function () {

                 //Added code
                 that.options.exportOptions.fileName = that.options.exportFileNameFormater() || that.options.exportOptions.fileName;

                 that.$el.tableExport($.extend({}, that.options.exportOptions, {
                         type: type,
                         escape: false
                     }));
                };

Finally, call the method as follows:

$(tableSelector).bootstrapTable({
url: GetServerUrl(moduleUrl),
method: 'post',
contentType:"application/x-www-form-urlencoded; charset=UTF-8",
toolbar: '#toolbar',
exportTypes:['excel', 'csv'],

   //Added code
  exportFileNameFormater:function(){
        //date_call() give the custom export file name
       return date_call();
     },

    exportOptions:{
       //fileName:date_call(),
        worksheetName: moduleName,
       },... ...

@lyl357159 any tip on using export types and filename in data attributes?

For export types, yes: data-export-types="['excel', 'pdf']"

For the filename the only way I know is to use the javascript function:

exportOptions: {

聽 | fileName: $reportFileName
聽 | }});

Sorry to resurrect an old thread, but the link to the fiddle for exporting using filename via attribute seems to be broken in the docs: http://jsfiddle.net/marcelk/6gd9w79u/

Is there a new fiddle we can take a look at to determine how best to use this?

Sorry to resurrect an old thread, but the link to the fiddle for exporting using filename via attribute seems to be broken in the docs: http://jsfiddle.net/marcelk/6gd9w79u/

Is there a new fiddle we can take a look at to determine how best to use this?

I just tried this and it seems to works _note the small n in 'filename'_
data-export-options='{"filename": "testo"}'

How I can change the name of worksheetName when I exporting the data?

@yuvarajjcse

Current time as file name different time for every export.
I did

function date_call()
 {
   var d = new Date();
   var name= 'download'+d.getFullYear()+("00" + (d.getMonth() + 1)).slice(-2)+("00" + d.getDate()).slice(-2)+("00" + d.getHours()).slice(-2)+ ("00" + d.getMinutes()).slice(-2)+ ("00" + d.getSeconds()).slice(-2);
   return name;
 }

exportOptions: { "fileName": date_call(), }
it only returns same time for all exports

It works at first refresh, and it means that the fileName's date time is all the same how mang times you click the export button. I have to create one new button to use the export plugin by myself, and I have no good idea to change the name using date time, thank you!

I managed to do it this way:

$(".export :button").on("click", function () {
    let $table = $('#table');
    $table.bootstrapTable('refreshOptions', {
        exportOptions: {"fileName": date_call()}
    });
})

But then, the dropdown menu requires 2 click (cause of refresh)...

Fixed in #4426 @algorys

Was this page helpful?
0 / 5 - 0 ratings

Related issues

thongkekienthuc12 picture thongkekienthuc12  路  16Comments

gadget00 picture gadget00  路  16Comments

iamthestreets picture iamthestreets  路  20Comments

iamthestreets picture iamthestreets  路  26Comments

DavidKrupi picture DavidKrupi  路  23Comments