J'utilise Excel Web requêtes pour exporter une table HTML (vue MVC) vers Excel. Comment puis-je le faire transporter sur les styles CSS? Si je définis class = "redlabel" il n'interprète pas cela et faire le rouge étiquette. Je dois utiliser des styles en ligne dans ma table pour que cela fonctionne. Des idées?
3 Réponses :
Autant que je sache, la plupart des programmes de bureau ne soutiennent pas le style inclus, mais seulement le style en ligne.
Il est probable que vous soyez obligé d'inclure votre style en ligne (exportation de suce, presque comme le style de courrier).
Excel prend en charge avec le style CSS, mais uniquement s'il y a une classe sur l'élément. S'il y a plusieurs classes, il ne fera aucun style sur l'élément, voir CSS Classe de style ne se combinent pas dans Excel
ayant déclaré que, c'est le code que j'ai mis en place pour saisir tous les styles sur une page et exporter une table HTML. C'est une force brute, prenez tout approche, mais vous pouvez probablement le coupler si vous connaissez les détails. La fonction renvoie une promesse de jQuery. De cela, vous pouvez faire tout ce qui concerne le résultat. P>
function excelExportHtml(table, includeCss) {
if (includeCss) {
var styles = [];
//grab all styles defined on the page
$("style").each(function (index, domEle) {
styles.push($(domEle).html());
});
//grab all styles referenced by stylesheet links on the page
var ajaxCalls = [];
$("[rel=stylesheet]").each(function () {
ajaxCalls.push($.get(this.href, '', function (data) {
styles.push(data);
}));
});
return $.when.apply(null, ajaxCalls)
.then(function () {
return "<html><style type='text/css'>" + styles.join("\n") + "</style>\n" + table.outerHTML + "</html>";
});
}
else {
return $.when({ owcHtml: table.outerHTML })
.then(function (result) {
return "<html>" + result.owcHtml + "</html>";
});
}
}
Vous pouvez exporter une table avec style CSS externe. Voici ma solution Déclarer un modèle de document:
var e = this;
var style = "<style></style"; //You can write css or get content of .css file
e.template = {
head: "<html xmlns:o=\"urn:schemas-microsoft-com:office:office\" xmlns:x=\"urn:schemas-microsoft-com:office:excel\" xmlns=\"http://www.w3.org/TR/REC-html40\"><head><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets>",
sheet: {
head: "<x:ExcelWorksheet><x:Name>",
tail: "</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet>"
},
mid: "</x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]-->>"+style+"</head><body>",
table: {
head: "<table>",
tail: "</table>"
},
foot: "</body></html>"
};
et où je mets du contenu de la table ou des données?