ignore internal html elements on export

ignore internal html elements on export

leniolenio Posts: 2Questions: 0Answers: 0

I have the following problem .. inside th I have span and div(but I only want to export to csv the text of the span(class="col-title") I don't want to export the div or what's inside it

<th scope="col" class="sorting_disabled">
<span class="col-title">Área</span>
<div class="dropdown bootstrap-select>
<select class="selectpicker">
<option value="sección de ingeniería">Sección de Ingeniería</option>
<option value="Área de gestión">Área de Gestión</option>
<option value="Área científica">Área Científica</option>
<option value="Área técnica">Área Técnica</option>
</select>
</div>
</th>

Replies

  • rf1234rf1234 Posts: 2,990Questions: 87Answers: 421

    Use exportOptions.format.body / header / footer like in here for example:

    buttons: [
        {   extend: "csv",
                exportOptions: {
                    format: {
                        body: function ( data, row, column, node ) {
                            //replace ampersands and other special chars
                            data = data.replace(/&gt;/g, '>')
                                       .replace(/&lt;/g, '<')
                                       .replace(/&amp;/g, '&')
                                       .replace(/&quot;/g, '"')
                                       .replace(/&#163;/g, '£')
                                       .replace(/&#39;/g, '\'')
                                       .replace(/&#10;/g, '\n');
                            //replace html tags with one space
                            data = data.replace(/<[^>]*>/g, ' ');
                            //replace multiple spaces and tabs etc with one space
                            return data.replace(/\s\s+/g, ' ');
                        },
                    }
                }
            }
        ]
    
  • leniolenio Posts: 2Questions: 0Answers: 0

    :s Please, if someone could help me with the regular expression... of this example... because I couldn't solve the problem

  • kthorngrenkthorngren Posts: 21,325Questions: 26Answers: 4,949
    edited January 2023

    If you use data.replace(/<[^>]*>/g, ' ') it will extract all the text including Área and the options like Sección de Ingeniería. Maybe something like this will work:

    buttons: [
        {   extend: "csv",
                exportOptions: {
                    format: {
                        header: function ( data, row, column, node ) {
                            // Get span text
                            var match = data.match(/<span class="col-title">(.*)<\/span>/);
                            // If found then use that as the data
                            if (match) {
                               data = match[1];
                            }
                            return data;
                        },
                    }
                }
            }
        ]
    

    I did not test this code so it may need some work :smile:

    It looks for the specific span text. If its found it will set the returned data to the found text. Otherwise it returns the original data.

    If you still need help please build a simple test case showing an example of what you have so we can provide more specific suggestions.
    https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

    Kevin

Sign In or Register to comment.