jqueryexport-to-csvhtml-tableextract

Not getting the value of an input element inside <td> while exporting table to csv


Html code

<html>
<td><input id="id1"  value="3000" a type="text" /></td>
</html>

I need the value 3000 to be in the csv file please help

My Function

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">





        var $rows = $table.find('tr:has(td)'),

            // Temporary delimiter characters unlikely to be typed by keyboard
            // This is to avoid accidentally splitting the actual contents
            tmpColDelim = String.fromCharCode(11), // vertical tab character
            tmpRowDelim = String.fromCharCode(0), // null character

            // actual delimiter characters for CSV format
            colDelim = '","',
            rowDelim = '"\r\n"',

            // Grab text from table into CSV formatted string
            csv = '"' + $rows.map(function (i, row) {
                var $row = $(row),
                    $cols = $row.find('td');

                return $cols.map(function (j, col) {
                    var $col = $(col),
                        text = $col.text();

                    return text.replace(/"/g, '""'); // escape double quotes

                }


</script>

write now iam getting the csv file with data as ,"","","","","","","",


Solution

  •  <script type="text/javascript">
    
    
        function exportTableToCSV($table, filename) {
                    var $headers = $table.find('tr:has(th)')
                        ,$rows = $table.find('tr:has(td)')
                        // Temporary delimiter characters unlikely to be typed by keyboard
                        // This is to avoid accidentally splitting the actual contents
                        ,tmpColDelim = String.fromCharCode(11) // vertical tab character
                        ,tmpRowDelim = String.fromCharCode(0) // null character
                        // actual delimiter characters for CSV format
                        ,colDelim = '","'
                        ,rowDelim = '"\r\n"';
                        // Grab text from table into CSV formatted string
                        var csv = '"';
                        csv += formatRows($headers.map(grabRow));
                        csv += rowDelim;
                        csv += formatRows($rows.map(grabRow)) + '"';
                        // Data URI
                        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),
                        $inputs = $col.find('input');
                        if($inputs.length >=1){
    						var $tot='';
                            $.each((jQuery.parseJSON(JSON.stringify($inputs.map(function(k,inp)
                            {
    							var $inputElement = $(inp),
    							$text=$inputElement.val();
    							
    							var $object=JSON.stringify($text);
    							//var newObject = JSON.parse(object);
    							console.log(JSON.parse($object));
    							return JSON.parse($object);
    							
    						})))),function(){
    							for(i=0;i<this.length;i++){
    							 $tot+=this[i];}
    							}); // escape double quotes
    						return $tot;
    					}
    					else
    					$text=$col.text();
    					return $text;
                    }
                }
    
           
    	
    	</script>

     $(".export88").click( function (event) {
            // CSV
            alert("clicked");
            exportTableToCSV.apply(this, [$('#datatab>table'), 'Sales_Data.csv']);
            
            // IF CSV, don't do event.preventDefault() or return false
            // We actually need this to be a typical hyperlink
        })
    <a href="#" class="export88" style="color: White;">Export</a>