0

I have tables and can be exported to Excel. In order to do so, it needs to have JQuery syntax. I have 2 separating JQuery syntax: 1 works for IE and the other works for FF,Chrome. Every individual syntax works alone well (tables' data appears in Excel). When I put them together, FF and Chrome still work fine, but there is an issue in IE.

In IE, when I click on the button, tables' data appears in Excel, but there is another IE browser popup, it is blank and the URL field is full of table's data (<table> <tr> <td>....). This issue doesn't happen if there is only JQuery code for IE in the page!

Here is the code

JS

<!--[if IE]>
<script>
$(document).ready(function() {
    $(".toExcelButton").click(function() {
        var table = $("." + $(this).data('target'));
        var strCopy = $('<div></div>').html(table.clone()).html(); window.clipboardData.setData("Text", strCopy);
        var objExcel = new ActiveXObject("Excel.Application");
        objExcel.visible = false; 
         var objWorkbook = objExcel.Workbooks.Add; 
        var objWorksheet = objWorkbook.Worksheets(1); 
        objWorksheet.Paste; 
        objExcel.visible = true;
    });
});
</script>
<![endif]-->
<script>
$(document).ready(
    function()
    {
        $(".toExcelButton").click(function(e) {
        var table = $("." + $(this).data('target'));
        window.open('data:application/vnd.ms-excel,' + $(table).html());
        e.preventDefault();
        });
    }
);
</script>

HTML

<div class="dvData">
    <table>
        <tr>
            <th>Billing System</th>
            <th>Market Code</th>
            <th>Payment Amount</th>
        </tr>
        <tr>
            <td>RED</td>
            <td>222</td>
            <td>$103.00</td>
        </tr>
        <tr>
            <td>BLUE</td>
            <td>111</td>
            <td>$13.00</td>
        </tr>
        <tr>
            <td>GREEN</td>
            <td>555</td>
            <td>$143.00</td>  
        </tr>
    </table>
    </div>
<br />
<input type="button" id="btnExport" value="Export" class="toExcelButton" data-target="dvData" /> 
<p>
<div class="dvData1">
<table>
             <tr>
                <th>Account System</th>
                <th>Market Code</th>
                <th>Payment Amount</th>
            </tr>
            <tr>
                <td>RED</td>
                <td>222</td>
                <td>$103.00</td>
            </tr>
            <tr>
                <td>BLUE</td>
                <td>111</td>
                <td>$13.00</td>
            </tr>
            <tr>
                <td>GREEN</td>
                <td>555</td>
                <td>$143.00</td>  
            </tr>
</table>
</div>
<br />
<input type="button" class="toExcelButton" data-target="dvData1" value="Export" />  
Lumi Lu
  • 3,289
  • 1
  • 11
  • 21
abcid d
  • 2,821
  • 7
  • 31
  • 46
  • You may be executing the script twice for IE, take a look at this post http://stackoverflow.com/questions/13785587/if-ie-not-working – inki Feb 05 '15 at 20:11
  • Thank you very much, Inki! You are right, IE generates the script twice. From the link you provided, I use ` if it is not IE ` for FF and Chrome's script. It works well now. Thanks – abcid d Feb 05 '15 at 20:25

0 Answers0