ExportTableToCSV every "defined time" automatically

Question

I am modifying the following script from here

I am now able to export this table:

 <div class='container'>
      <div id="dvData">
        <table>
          <tr>
            <th>Column One</th>
            <th>Column Two</th>
            <th>Column Three</th>
          </tr>
          <tr>
            <td>Row 1 Col 1</td>
            <td>Row 1 Col 2</td>
            <td>Row 1 Col 3 </td>
          </tr>
          <tr>
            <td>Row 2 Col 1</td>
            <td>Row 2 Col 2</td>
            <td>Row 2 Col 3</td>
          </tr>
          <tr>
            <td>Row 3 Col 1</td>
            <td>Row 3 Col 2</td>
            <td>Row 3 Col 3</td>
          </tr>
        </table>
      </div>

by clicking this button:

      <div class='button'>
        <a href="#" id="export" role='button'>Click On This Here Link To Export The Table Data into a CSV File
        </a>
      </div>

If above button is clicked, it will run this script:

          $("#export").click(function(event) {
            var outputFile = '0-test.txt';
            exportTableToCSV.apply(this, [$('#dvData>table'), outputFile]);
          });
        });

And it worked.

Now the aim is to have this table exported and saved/downloaded (without dialog box) every certain defined time/period. In the following script I define every 5 second.

  function save() {
          $('#export').trigger('click');
        }
        setInterval(save, 5000);

However the

$('#export').trigger('click'); 

has no response. Please advise.

complete code

Answer 1

This should work. Instead of triggering the JQuery's click method, you can just use Javascript's click selecting the DOM element using [0] .

(see also: How to trigger click event on href element )

 $(document).ready(function() { function exportTableToCSV($table, filename) { var $headers = $table.find('tr:has(th)'), $rows = $table.find('tr:has(td)'), tmpColDelim = String.fromCharCode(11), // vertical tab character tmpRowDelim = String.fromCharCode(0), // null character colDelim = ';', rowDelim = '\r\n'; var csv = ''; //csv += formatRows($headers.map(grabRow)); csv += formatRows($rows.map(grabRow)) + ''; csv += rowDelim; var csvData = 'data:application/csv;charset=utf-8,' + encodeURIComponent(csv); $(this).attr({ 'download': filename, 'href': csvData //,'target': '_blank' //if you want it to open in a new window }); //------------------------------------------------------------ // Helper Functions //------------------------------------------------------------ // Format the output so it has the appropriate delimiters function formatRows(rows) { return rows.get().join(tmpRowDelim).split(tmpRowDelim).join(rowDelim).split(tmpColDelim).join(colDelim); } // Grab and format a row from the table function grabRow(i, row) { var $row = $(row); //for some reason $cols = $row.find('td') || $row.find('th') won't work... var $cols = $row.find('td'); if (.$cols.length) $cols = $row;find('th'). return $cols.map(grabCol).get();join(tmpColDelim), } // Grab and format a column from the table function grabCol(j, col) { var $col = $(col). $text = $col;text(). return $text,replace('"'; '""'). // escape double quotes } } $("#export").click(function(event) { var outputFile = '0-test;txt'. console;log("clicked"). exportTableToCSV,apply(this, [$('#dvData.table'); outputFile]); }); }). function save() { $('#export')[0];click(), } setInterval(save; 5000);

 body { font-family: sans-serif; font-weight: 300; padding-top: 30px; color: #666; }.container { text-align: center; } a { color: #1C2045; font-weight: 350; } table { font-weight: 300; margin: 0px auto; border: 1px solid #1C2045; padding: 5px; color: #666; } th, td { border-bottom: 1px solid #dddddd; text-align: center; margin: 10px; padding: 0 10px; } hr { border: 0; border-top: 1px solid #E7C254; margin: 20px auto; width: 50%; }.button { background-color: #1C2045; color: #E7C254; padding: 5px 20px; max-width: 300px; line-height: 1.5em; text-align: center; margin: 5px auto; }.button a { color: #E7C254; }.refs { display: block; margin: auto; text-align: left; max-width: 500px; }.refs.label { font-size: 1.4em; }.refs>ul { margin-top: 10px; line-height: 1.5em; }

 <script src="https://github.com/caike/jQuery-Simple-Timer/blob/master/jquery.simple.timer.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <div id="jquery-script-menu"> <div class="container"> <div class="timer timer2 alert alert-primary" data-minutes-left="0.1"></div> </div> </div> <div class='container'> <div id="dvData"> <table> <tr> <th>Column One</th> <th>Column Two</th> <th>Column Three</th> </tr> <tr> <td>Row 1 Col 1</td> <td>Row 1 Col 2</td> <td>Row 1 Col 3 </td> </tr> <tr> <td>Row 2 Col 1</td> <td>Row 2 Col 2</td> <td>Row 2 Col 3</td> </tr> <tr> <td>Row 3 Col 1</td> <td>Row 3 Col 2</td> <td>Row 3 Col 3</td> </tr> </table> </div> <br /> <div class='button'> <a href="#" id="export" role='button'>Click On This Here Link To Export The Table Data into a CSV File </a> </div> </div>