Forum Discussion

FICO's avatar
FICO
Community Manager
4 years ago

Is there a way to export a multi-scenario VDL table?

Hello,

One can create a VDL table containing data from several scenarios with:

          <vdl-table>

            <vdl-table-column entity="Entity" vdl-repeat="=s,i in scenarios" scenario="=i" heading="=s.props.name"></vdl-table-column>

          </vdl-table>

This is a great feature but is there a way to export this table to Excel or csv file?

Thank you!

Miroslav

2 Replies

  • FICO's avatar
    FICO
    Community Manager

    Hi Miroslav,

    you may want to try vdlx-datagrid. https://github.com/fico-xpress/vdlx-datagrid/

    It offers export to CSV by setting show-export tag to true; you can also specify filename using tag export-filename.

    Be aware, it does not offer block selection with copy and paste, and other minor ones which vdl-table does. Comparison is listed on the main page of the link.

    Once the underlying library does support the critical features and we picked it up, it will likely become replacement for the current table library.

    Jens

  • FICO's avatar
    FICO
    Community Manager

    Hi Miroslav,

    It is possible to export any vdl table (including a multi-scenario one). The first step is to add 2 attributes to the vdl-table element:

    • id to uniquely identify the table
    • modifier, which receives the name of a JS function that allows you to... modify the table. You must define the function, which receives 1 object (config) and must return the same (modified) obejct.

    You also need to include a few libraries.

      <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>

      <script src="https://cdn.datatables.net/buttons/2.1.0/js/dataTables.buttons.min.js"></script>

      <script src="https://cdn.datatables.net/buttons/2.1.0/js/buttons.html5.min.js"></script>

      <script src="https://cdn.datatables.net/buttons/2.1.0/js/buttons.print.min.js"></script>

    <script>

        function updateTableConf(config) {

          // This line adds buttons at the top of the table (letter B) the rest being identical to default dom definition

          config.overrides.sDom = "B<'row'<'col-sm-6'><'col-sm-6'<'pull-right' f>>><'row'<'col-sm-12'tr>><'row'<'toolbar'><'autotable-pagination-control'<'pull-right' p>>>";

          console.log(config);

          return config;

        }

      </script>

     <vdl-table id="myTable"modifier="=updateTableConf">

                <vdl-table-column entity="Entity" vdl-repeat="=s,i in scenarios" scenario="=i" heading="=s.props.name"></vdl-table-column>

    </vdl-table>

    The vdl-table component is a wrapper for the datatables library. So, you can find more information at https://datatables.net/