Kendo UI Grid Export to Excel / PDF not working on

问题:

I´m having problem to export Kendo UI Grid to excel and pdf in IE9.
Everythig works fine using Chrome but in IE9 nothing happens.
Here is my grid. Is there something wrong or missing?

        $("#gridDetalhes").kendoGrid({

            dataSource: {
                data: myJsonList
            },


            excel: {
                allPages: true,
                fileName: "SGD_Detalhes.xlsx"
            },


            toolbar: ["excel", "pdf"],


            columns: [


                   { field: "DataInicio", width: "135px", title: "Início", type: "date", template: '#= kendo.toString(DataInicio,"dd/MM/yyyy HH:mm:ss") #' },
                   { field: "DataFim", width: "135px", title: "Fim", type: "date", template: '#= kendo.toString(DataFim,"dd/MM/yyyy HH:mm:ss") #' },
                   { field: "Duracao", width: "80px", title: "Duração", type: "string" },
                   { field: "Gerador", width: "40px", title: "A/M", type: "string" },
                   { field: "Identificador", width: "120px", title: "Identificador", type: "string" },

            ]


        });

回答1:

The export function does not support Safari, IE9 and below. For unsupported browsers, you need to provide the proxyUrl to specify the server proxy URL.

See examples of Server Proxy Implementations (for ASP.NET WebForms/API/MVC, PHP, Java/Spring MVC)

For example - server controller action for ASP.NET MVC:

public class HomeController
{
    [HttpPost]
    public ActionResult KendoSave(string contentType, string base64, string fileName)
    {
        var fileContents = Convert.FromBase64String(base64);

        return File(fileContents, contentType, fileName);
    }
}

And then you need to provide proxyUrl parameter pointing to this action:

excel: {
                allPages: true,
                fileName: "SGD_Detalhes.xlsx"
                proxyURL: "/Home/KendoSave",
       }

Hope it helps.

回答2:

Specify the Kendo UI recommended DOCTYPES like XHTML 1.1, XHTML 1.0 Strict or HTML4 Strict in your markup

Also, use IE's Edge mode via META tag or HTTP header

<meta http-equiv="X-UA-Compatible" content="IE=edge" />

回答3:

I was struggling myself with the same issue and implementing the server-side, so I've ended up with the simplest nodejs version. Here's the code:

var fs = require('fs');
var express = require('express');
var bodyParser = require('body-parser');
var app = express();
app.use(bodyParser.json()); // for parsing application/json
app.use(bodyParser.urlencoded({ extended: true })); // for parsing application/x-www-form-urlencoded
app.post('/save', function(req,res){
  var fContents = req.body.base64;
  var fName = req.body.fileName;
  var buffer = new Buffer(fContents, 'base64');
  res.setHeader('Content-disposition', 'attachment; filename=' + fName);
  res.send(buffer);
})
app.listen(80);