2022-07-17 01:21:31 +02:00
<!DOCTYPE html>
< html lang = "fr" >
< head >
< title > Exemple pour le développement< / title >
< meta http-equiv = "Content-Type" content = "text/html; charset=UTF-8" >
< meta http-equiv = "Content-Script-Type" content = "text/javascript" >
< link href = "dev.css" rel = "stylesheet" type = "text/css" >
< script type = "text/javascript" src = "../src/js/currency/Currency.js" > < / script >
< script type = "text/javascript" src = "../src/js/xmlwriter/XmlWriter.js" > < / script >
< script type = "text/javascript" src = "../src/js/opendocument/OpenDocument.js" > < / script >
< script type = "text/javascript" src = "../src/js/opendocument/OpenDocument.Elements.js" > < / script >
< script type = "text/javascript" src = "../src/js/opendocument/OpenDocument.CellCounter.js" > < / script >
< script type = "text/javascript" src = "../src/js/opendocument/OpenDocument.XmlWriter.js" > < / script >
< script type = "text/javascript" src = "../src/js/opendocument/OpenDocument.Style.js" > < / script >
< script type = "text/javascript" src = "../src/js/opendocument/OpenDocument.StyleManager.js" > < / script >
< script type = "text/javascript" src = "../src/js/opendocument/OpenDocument.OdsConverter.js" > < / script >
2022-07-27 17:04:18 +02:00
< script type = "text/javascript" src = "../src/js/Html2Ods.js" > < / script >
2022-07-17 01:21:31 +02:00
< script >
2022-08-01 10:35:19 +02:00
var options = {
currency: "EUR",
datePattern: "DD/MM/YYYY",
textAlias: "texteAlternatif"
};
2022-07-17 01:21:31 +02:00
function fodsLink() {
let link = document.getElementById("link");
link.href = URL.createObjectURL(
2022-08-01 10:35:19 +02:00
Html2Ods.blob("table", options)
2022-07-17 01:21:31 +02:00
);
setTimeout(function () {
URL.revokeObjectURL(link.href);
}, 4E4); // 40s
return true;
}
function fodsContent() {
2022-08-01 10:35:19 +02:00
document.getElementById("text").innerText = Html2Ods.xml("table", options);
2022-07-17 01:21:31 +02:00
}
< / script >
< / head >
< body onload = "fodsContent()" >
< h1 > Exemple pour le développement< / h1 >
< p > Le contenu du fichier .fods est affiché après la table< / p >
< div >
2022-07-29 14:18:11 +02:00
< p > < a href = "blob:" download = "test1.fods" id = "link" onclick = "fodsLink()" > Version ODS< / a > < / p >
2022-07-17 01:21:31 +02:00
< table id = "table"
data-od-sheetname="Tableau de suivi"
data-od-fixed-rows="2"
2022-08-01 10:35:19 +02:00
data-od-fixed-columns="1"
>
2022-07-17 01:21:31 +02:00
< col data-od-style = "Longue" >
< colgroup >
2022-07-27 17:04:18 +02:00
< col data-od-style = "Courte" >
2022-07-17 01:21:31 +02:00
< / colgroup >
2022-07-27 17:04:18 +02:00
< colgroup span = "2" class = "moyennecolonne" >
2022-07-17 01:21:31 +02:00
< / colgroup >
< thead >
< tr data-od-style = "Entete" >
< th colspan = "3" > Colonne 1< / th >
< th rowspan = "2" > Colonne 3< / th >
< / tr >
< tr >
< th > Sous-colonne 1-1< / th >
< th > Sous-colonne 1-2< / th >
< th > Sous-colonne 1-3< / th >
< / tr >
< / thead >
< tbody >
< tr >
< td > Cellule 1.1< / td >
< td rowspan = "2" id = "test" > Cellule < em > 1.2< / em >
< div class = "hidden" >
Caché par None
< / div > Suite< / td >
< td > Cellule 1.3
< div data-od-hidden = "true" >
Caché dans OD
< / div > Test à des lignes vides < / td >
2022-07-27 17:04:18 +02:00
< td data-od-style = "Heritage" > Cellule 1.4< / td >
2022-07-17 01:21:31 +02:00
< / tr >
< tr >
2022-07-27 17:04:18 +02:00
< td data-od-style = "EncorePlusGrande" > Cellule 2.1 (Très grande)< / td >
2022-07-17 01:21:31 +02:00
<!-- <td>Cellule 2.2</td> -->
< td data-od-style = "Bold" > Cellule 2.3< / td >
< td data-od-type = "number" class = "grandecellule" > -160< / td >
< / tr >
< tr >
2022-07-27 17:04:18 +02:00
< td colspan = "2" > Cellule 3.1< / td >
< td data-od-type = "currency" data-od-text = "1250" > 1100 €< / td >
2022-08-01 10:35:19 +02:00
< td data-od-type = "currency" data-od-currency = "USD" data-texte-alternatif = "-1315" class = "essai" > -$2500< / td >
2022-07-29 14:18:11 +02:00
< / tr >
< tr >
2022-08-01 10:35:19 +02:00
< td data-od-type = "date" data-od-text = "2020-12-01" data-od-date-pattern = "D/M/YY" > 1/12/20< / td >
2022-07-29 14:18:11 +02:00
< td data-od-type = "date" data-od-text = "2021-01-11" > 11/01/2021< / td >
< / tr >
2022-07-30 13:00:39 +02:00
< tr >
< td > Exemple de correspondance de plusieurs classes< / td >
< td class = "class1" > Classe 1< / td >
< td class = "class2" > Classe 2< / td >
< / tr >
2022-07-30 14:27:05 +02:00
< tr data-od-style = "HauteurFixe" >
< td > < / td >
< td data-od-style = "LongTexte" > < p > Exemple de texte long avec plusieurs paragraphes< / p > < p > Et qui ne déborde pas< / p > < p > quelque soit la longueur (la hauteur est réglée au niveau de l'élement < tr> parent< / p > < / td >
< / tr >
2022-08-08 21:45:16 +02:00
< tr style = "display: none" >
< td > Ligne invisible< / td >
< / tr >
< tr style = "display: none" data-od-hidden = "false" >
< td > Ligne invisible en HTML, visible en ODS< / td >
< / tr >
< tr data-od-hidden = "true" >
< td > Ligne visible en HTML, invisible en ODS< / td >
< / tr >
2022-07-17 01:21:31 +02:00
< / tbody >
< / table >
< pre id = "text" > < / pre >
< / div >
< / body >
< / html >
