Excel Exported as empty file

[RavikumarRMember]

I have used table Grid in my Report & give excel export option in it. In this , excel is downloaded as empty file.
Please provide solution to this issue as early as possible.

Regards,
Rajkumar.R

[Peter StoevKeymaster]

Hi Rajkumar.R,

Would you provide a sample which demonstrates that behavior? In addition, make sure that the Grid is not in virtual mode because in virtual mode, it will not export anything.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[dennishMember]

I’m having the same issue. I’ve been able to export to Excel in all my pages since October 2012 and now the exported/downloaded file is 0 bytes and contains nothing. This just started in the past few days, maybe longer. Nothing has changed on our side. I even provided code below but this is just one of several pages with the same issue. I’m almost sure its the jqwidget site (save-file.php) having the issue. I did check the demo export page and it’s working as expected.

Environment:
Using ASP.net 4.0 hosted on IIS 7
Windows Server 2008
jQWidgets v2.4.2 (2012-Sep-12)

1. Using jqxGrid
2. Click on Export
3. Sending request to jqwidgets.com
4. Downloading 10%…20%…30%…
virtual mode is FALSE
Result: Click on the exported Excel and it’s empty.

Here is the entire .aspx page with is mostly javascript. I hope its formatted correctly. Please advise.

<%@ Page Title="Manage Users" Language="C#" MasterPageFile="../Site.Master" AutoEventWireup="true" CodeBehind="Users.aspx.cs" Inherits="Kitsap.Admins._Users" %>
 <asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
 <link href="../Styles/jqx.base.css" rel="stylesheet" type="text/css" />
    <link href="../Styles/jqx.classic.css" rel="stylesheet" type="text/css" />
    <link href="../Styles/jqx.summer.css" rel="stylesheet" type="text/css" />
    <link href="../Styles/kitsap_custom1.css" rel="stylesheet" type="text/css" />
    <script src="../Scripts/jquery-1.8.1.min.js" type="text/javascript"></script>
    <script src="../Scripts/jqxcore.js" type="text/javascript"></script>
    <script src="../Scripts/jqxbuttons.js" type="text/javascript"></script>
    <script src="../Scripts/jqxdropdownlist.js" type="text/javascript"></script>
    <script src="../Scripts/jqxdatetimeinput.js" type="text/javascript"></script>
    <script src="../Scripts/jqxcheckbox.js" type="text/javascript"></script>
    <script src="../Scripts/jqxlistbox.js" type="text/javascript"></script>
    <script src="../Scripts/jqxgrid.js" type="text/javascript"></script>
    <script src="../Scripts/jqxgrid.edit.js" type="text/javascript"></script>
    <script src="../Scripts/jqxgrid.selection.js" type="text/javascript"></script>
    <script src="../Scripts/jqxgrid.filter.js" type="text/javascript"></script>
    <script src="../Scripts/jqxmenu.js" type="text/javascript"></script>
    <script src="../Scripts/jqxscrollbar.js" type="text/javascript"></script>
    <script src="../Scripts/jqxdata.js" type="text/javascript"></script>
    <script src="../Scripts/jqxgrid.export.js" type="text/javascript"></script>
    <script src="../Scripts/jqxdata.export.js" type="text/javascript"></script>
    <script src="../Scripts/jqxgrid.sort.js" type="text/javascript"></script>
    <script src="../Scripts/jqxcalendar.js" type="text/javascript"></script>
    <script src="../Scripts/gettheme.js" type="text/javascript"></script>
    <script src="../Scripts/jqxgrid.pager.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            var theme = getTheme();
            //Getting the source data with ajax GET request
            source = {
                datatype: "xml",
                updaterow: function (rowid, rowdata) {
                    // synchronize with the server - send update command   
                    var data = $.param(rowdata);
                    //alert(data);
                    $.ajax({
                        type: "POST",
                        async: true,
                        contentType: "application/json; charset=utf-8",
                        url: "Users.aspx/Update",
                        //data: "{}", //get only
                        data: "{ column: '" + editingColumn + "', contractorID: '" + rowdata["ContractorID"] + "', firstName: '" + rowdata["FirstName"] +
                                    "', lastName: '" + rowdata["LastName"] + "', loginName: '" + rowdata["LoginName"] +
                                    "', password: '" + rowdata["Password"] + "', company: '" + rowdata["Company"] +
                                    "', address: '" + rowdata["Address"] + "', city: '" + rowdata["City"] +
                                    "', state: '" + rowdata["State"] + "', zip: '" + rowdata["Zip"] +
                                    "', county: '" + rowdata["County"] + "', phone1: '" + rowdata["Phone1"] +
                                    "', phone2: '" + rowdata["Phone2"] + "', email: '" + rowdata["Email"] +
                                    "', status: '" + rowdata["Status"] +
                                "'}",
                        dataType: "json",
                        success: function (msg) {
                            // Replace the div's content with the page method's return.
                            if (msg.d == -201) {
                                alert("That Login already exists on the system.");
                                //$("#Result").text("That Login already exists on the system.");
                            } else if (msg.d == 0) {
                                alert("Error activating new user.\nThe first name or last name cannot be empty");
                            }
                            else {
                                $("#Result").text(msg.d);
                                //alert("refreshing data...");
                                source = dataAdapter;
                                $("#jqxgrid").jqxGrid('updatebounddata'); //WORKS!   
                            }
                        }
                    });
                },
                addrow: function (rowid, rowdata) {
                    //alert("inside addrow: firstName = " + rowdata["FirstName"]);
                    $.ajax({
                        type: "POST",
                        async: true,
                        contentType: "application/json; charset=utf-8",
                        url: "Users.aspx/AddNewUser",
                        //data: "{}", //get only
                        data: "{ firstName: '" + rowdata["FirstName"] + "', lastName: '" + rowdata["LastName"] + "', email: '" + rowdata["Email"] + "'}",
                        dataType: "json",
                        success: function (msg) {
                            //alert(msg.d);
                            // Replace the div's content with the page method's return.
                            //$("#jqxgrid").jqxGrid('updatebounddata');
                            $("#Result").text(msg.d);
                            if (msg.d != -1) {
                                if (msg.d == -201) {
                                    $("#Result").text("That Login already exists on the system.");
                                }
                                //alert("refreshing data...");
                                source = dataAdapter;
                                $("#jqxgrid").jqxGrid('updatebounddata'); //WORKS!
                                if (msg.d != -99) {
                                    $('#jqxgrid').jqxGrid('selectcell', 0, 'FirstName');
                                }
                            }
                        }
                    });
                },
                datafields: [
                    { name: 'ContractorID' },
                    { name: 'UserID' },
                    { name: 'FirstName' },
                    { name: 'LastName' },
                    { name: 'LoginName' },
                    { name: 'Password' },
                    { name: 'Company' },
                    { name: 'Address' },
                    { name: 'City' },
                    { name: 'State' },
                    { name: 'Zip' },
                    { name: 'County' },
                    { name: 'Phone1' },
                    { name: 'Phone2' },
                    { name: 'Email' },
                    { name: 'Status' }
                ],
                async: true,
                record: 'Table',
                url: 'Users.aspx/GetAllUsers'
            };
            var dropdownStatusData =
                [{
                    "id": 0,
                    "name": "ACTIVE"
                }, {
                    "id": 1,
                    "name": "INACTIVE"
                }, {
                    "id": 2,
                    "name": "ADMIN"
                }, {
                    "id": 3,
                    "name": "DELETE"
                }];
            //STATUS Dropdown
            var dropDownStatusListSource =
            {
                datatype: "json",
                datafields: [
                    { name: 'name' }
                ],
                id: 'id',
                localdata: dropdownStatusData
            };
            var dropdownStatusListAdapter = new $.jqx.dataAdapter(dropDownStatusListSource, { autoBind: true, async: false });
            var dataAdapter = new $.jqx.dataAdapter(source,
                { contentType: 'application/json; charset=utf-8' }
            );
            //***ADD a new user***
            // create new row.
            $("#addNewUser").jqxButton({ theme: 'summer' });
            // create new row.
            $("#addNewUser").bind('click', function () {
                //alert("inside click event for addNewUser");
                var datarow = createNewUser();
                $("#jqxgrid").jqxGrid('addrow', null, datarow);
            });
            var createNewUser = function (i) {
                var row = {};
                row["FirstName"] = 'First Name';
                row["LastName"] = 'Last Name';
                row["Email"] = 'Email_' + 1 + Math.floor(Math.random() * 1000);
                return row;
            };
            //END
            $("#jqxgrid").jqxGrid({
                source: dataAdapter,
                width: 1750,
                height: 850,
                theme: 'kitsap_custom1',
                altrows: true,
                sortable: true,
                editable: true,
                filterable: true,
                showfilterrow: true,
                columnsresize: true,
                virtualmode: false,
                selectionmode: 'singlecell',
                columns: [
                    { text: 'Status', filtertype: 'list', columntype: 'dropdownlist', datafield: 'Status', width: 140,
                        initeditor: function (row, cellvalue, editor) {
                            editor.jqxDropDownList({ displayMember: 'name', source: dropdownStatusListAdapter, width: 140 });
                        }
                    },
                    { text: 'First Name', dataField: 'FirstName', width: 100 },
                    { text: 'Last Name', dataField: 'LastName', width: 110 },
                    { text: 'ID', dataField: 'ContractorID', width: 50, editable: false },
                    { text: 'Login', dataField: 'LoginName', width: 110, editable: false, filterable: true, sortable: false },
                    { text: 'Password', dataField: 'Password', width: 110, filterable: true, sortable: false },
                    { text: 'Company Name', dataField: 'Company', width: 220 },
                    { text: 'Address', dataField: 'Address', width: 250 },
                    { text: 'City', dataField: 'City', width: 140 },
                    { text: 'State', dataField: 'State', width: 50 },
                    { text: 'Zip Code', dataField: 'Zip', width: 80 },
                    { text: 'County', dataField: 'County', width: 100 },
                    { text: 'Phone1', dataField: 'Phone1', width: 140 },
                    { text: 'Phone2', dataField: 'Phone2', width: 140 },
                    { text: 'Email', dataField: 'Email', width: 280 }
                ]
            });
            $("#excelExport").jqxButton({ theme: 'summer' });
            //exporting ALL DATA to Excel
            $("#excelExport").click(function () {
                $("#jqxgrid").jqxGrid('exportdata', 'xls', 'Kitsap_Contractors_Export', true);
            });
            // events
            $("#jqxgrid").bind('cellbeginedit', function (event) {
                var args = event.args;
                $("#cellbegineditevent").html("Event Type: cellbeginedit, Column: " + args.datafield + ", Row: " + (1 + args.rowindex) + ", Value: " + args.value);
            });
            $("#jqxgrid").bind('cellendedit', function (event) {
                var args = event.args;
                editingColumn = args.datafield; //global value for edited column
                $("#cellendeditevent").html("Event Type: cellendedit, Column: " + args.datafield + ", Row: " + (1 + args.rowindex) + ", Value: " + args.value);
            });
        });
    </script>
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
        <div style="margin-top: 10px;">
            <div style='float: left;'>
                <input id="addNewUser" type="button" value="+ Add New Contractor" style="margin-bottom: 10px"/>
                <b></b>
            </div>
        </div>
        <div id="jqxgrid" ></div>
        <div style="margin-top: 10px; margin-bottom: 30px;">
            <div style='float: left;'>
                <input id="excelExport" type="button" value="Export ALL Contractors to Excel" style="margin-bottom: 10px"/>
                <b></b>
            </div>
            <div id="cellbegineditevent"></div>
            <div style="margin-top: 10px;" id="cellendeditevent"></div>
            <div id="Result" style='float: right; color: red'></div>
       </div>
</asp:Content>

[Peter StoevKeymaster]

Hi dennish,

As is is working with jQWidgets 2.7, you can update to it. Another solution is to export the data to a variable and send it to your own server. A third solution is to host the save-file.php on your own server(in case you are a licensed developer).

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts