Author Topic: Why won't my 'export to csv' button do anything?  (Read 4259 times)

[email protected]

  • Newbie
  • *
  • Posts: 7
    • View Profile
Why won't my 'export to csv' button do anything?
« on: July 09, 2019, 09:22:42 am »

Hi,

I'm new to Param Query and it looks great!  I've successfully populated the grid from one of my database tables, but I can't figure out 2 things:

1) How to write data back to the table once its updated.
2) How to export to CSV. (I'm trying this as a starting point, but the button doesn't do anything, even though I've followed the examples.)

My program is listed below.

Any help is greatly appreciated.

Regards,
Paul




<!DOCTYPE HTML>
<html>
<head>
<!--jQuery dependencies-->
    <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/themes/base/jquery-ui.css" />
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>   
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
<!--PQ Grid files-->
    <link rel="stylesheet" href="pqgrid.min.css" />
    <script src="pqgrid.min.js"></script>
<!--PQ Grid Office theme-->
    <link rel="stylesheet" href="themes/office/pqgrid.css" />

<script>
    <%
    myDSN   = "PROVIDER=SQLOLEDB;DATA SOURCE=" & Session("SystemServer") & ";INITIAL CATALOG=" & Session("SystemDatabaseName") & ";UID=" & Session("SystemUserName") & ";PWD=" & Session("SystemPassWord") & ""
    mySQL   = "select * from mine where active = 'Y' order by minename"
    set rs1 = server.createobject("adodb.recordset")
    rs1.open mySQL,myDSN
    myCount = 1
    myArray = "["
    Do While Not rs1.EOF
       myRowData = "['" & rs1.fields(0) & "', '" & rs1.fields(2) & "', '" & rs1.fields(13) & "', '" & rs1.fields(29)  & "', '" & rs1.fields(4) & "']"
       myArray = myArray & myRowData
       myCount = myCount + 1
       rs1.MoveNext
       if Not rs1.EOF then
          myArray = myArray & ","
       end if
    Loop
    myArray = myArray & "]"
    %>


    $(function () {

        var data = <%=myArray%>;

        obj.colModel = [
        { title: "Mine ID",    width: 25,  dataType: "string", align: "left" },
        { title: "Mine Name",  width: 150, dataType: "string", align: "left" },
        { title: "Classic ID", width: 100, dataType: "float",  align: "left"},
        { title: "Lat/Long",   width: 100, dataType: "string", align: "left"},
        { title: "Active",     width: 10,  dataType: "string", align: "center" }
        ];

        obj.dataModel = { data: data };
        $("#grid_array").pqGrid(obj);
        });

        var obj = {
            width: 1000,
            height: 500,
            title: "Timesheet Users Table",
            numberCell:{resizable:true, title: "#"},
            showTitle: true,
            height: 'flex',
            scrollModel: { autoFit: true },
            pageModel: { type: 'local' },
            toolbar: {
                cls: 'pq-toolbar-export',
                items: [{
                    type: 'button',
                    label: "Export to CSV",
                    icon: 'ui-icon-document',
                    listener: function () {
                        //debugger;
                        var zip = $("#zip_file").prop("checked");
                        this.exportCsv({
                            url: "/bin",
                            render: true,
                            zip: zip,
                            filename: 'my-file'
                        });
                    }
                },
                {
                    type: 'checkbox',
                    style: 'margin-right:10px;',
                    attr: 'id="zip_file"',
                    label: 'Zip the file'
                }]
            }
        };

</script>   
</head>

<body>
    <h1>Pauls Grid Example (https://paramquery.com/)</h1>
    <div id="grid_array" style="margin:0px;"></div>
</body>
</html>

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6310
    • View Profile
Re: Why won't my 'export to csv' button do anything?
« Reply #1 on: July 09, 2019, 11:58:46 am »
Paul

In case of export to csv/excel, exported data is send to server url and server responds by composing data in file and sending it as a downloadable file.

The server side code is mentioned in the ASP.NET / PHP / Java tabs in this demo:

https://paramquery.com/demos/export_csv

[email protected]

  • Newbie
  • *
  • Posts: 7
    • View Profile
Re: Why won't my 'export to csv' button do anything?
« Reply #2 on: July 10, 2019, 03:51:28 am »
That example doesn't work either.  Is it because I'm using the FREE version?

This is the code I cut and assembled from the example you provided, and it doesn't download either.


<!DOCTYPE HTML>
<html>
<head>

<!--jQuery dependencies-->
    <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/themes/base/jquery-ui.css" />
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>   
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
<!--PQ Grid files-->
    <link rel="stylesheet" href="pqgrid.min.css" />
    <script src="pqgrid.min.js"></script>
<!--PQ Grid Office theme-->
    <link rel="stylesheet" href="themes/office/pqgrid.css" />


<script>
    $(function () {
        var data = [
            {rank:1, company:'Exxon Mobil',revenues: '339,938.0',profits: '36,130.0'},
            {rank:2, company:'Wal-Mart Stores',revenues: '315,654.0', profits:'11,231.0'},
          {rank:3, company:'Royal Dutch Shell', revenues:'306,731.0', profits:'25,311.0'},
          {rank:4, company:'BP', revenues:'267,600.0',profits: '22,341.0'},
          {rank:5, company: 'General Motors',revenues: '192,604.0', profits:'-10,567.0'},
          {rank:6, company: 'Chevron', revenues:'189,481.0', profits:'14,099.0'},
          {rank:7, company: 'DaimlerChrysler',revenues: '186,106.3',profits: '3,536.3'},
          {rank:8, company: 'Toyota Motor', revenues:'185,805.0',profits: '12,119.6'},
          {rank:9, company: 'Ford Motor', revenues:'177,210.0',profits: '2,024.0'},
          {rank:10, company: 'ConocoPhillips', revenues:'166,683.0', profits:'13,529.0'},
          {rank:11, company: 'General Electric',revenues: '157,153.0', profits:'16,353.0'},
          {rank:12, company: 'Total', revenues:'152,360.7', profits:'15,250.0'},
          {rank:13, company: 'ING Group', revenues:'138,235.3', profits:'8,958.9'},
          {rank:14, company: 'Citigroup', revenues:'131,045.0', profits:'24,589.0'},
          {rank:15, company: 'AXA', revenues:'129,839.2', profits:'5,186.5'},
          {rank:16, company: 'Allianz',revenues: '121,406.0', profits:'5,442.4'},
          {rank:17, company: 'Volkswagen', revenues:'118,376.6',profits: '1,391.7'},
          {rank:18, company: 'Fortis', revenues:'112,351.4', profits:'4,896.3'},
          {rank:19, company: 'Credit Agricole', revenues:'110,764.6', profits:'7,434.3'},
          {rank:20, company: 'American Intl. Group', revenues:'108,905.0',profits: '10,477.0'}
      ];

        var obj = {
            showTitle: false,
            height: 'flex',
            scrollModel: { autoFit: true },
            pageModel:{type:'local'},
            toolbar: {
                cls: 'pq-toolbar-export',
                items: [{
                        type: 'button',
                        label: "Export to CSV",
                        icon: 'ui-icon-document',
                        listeners: [{
                            "click": function (evt) {
                                $("#grid_export").pqGrid("exportCsv", { url: "/pro/demos/excel" });
                            }
                        }]
                }]
            }                       
        };
        obj.colModel = [       
            { title: "Rank", width: 100, dataType: "integer",dataIndx:"rank"},
            { title: "Company", width: 200, dataType: "string", dataIndx:"company"},
            { title: "Revenues ($ millions)", width: 150, dataType: "float", align: "right", dataIndx:"revenues" },
            { title: "Profits ($ millions)", width: 150, dataType: "float", align: "right", dataIndx: "profits" }
        ];
        obj.dataModel = {
            data: data,
            location: "local",
            sorting: "local",                                 
            sortIndx: "profits",
            sortDir: "down"           
        };
        var $grid = $("#grid_export").pqGrid(obj);
    });
</script>
</head>
<body>

    <div id="grid_export" style="margin: auto;">
    </div>


</body>
</html>


« Last Edit: July 10, 2019, 03:53:32 am by [email protected] »