2011-08-02 9 views
10

Używam Excelowych zapytań internetowych do eksportowania tabeli html (widok mvc) do Excela. Jak mogę go przenieść przez style CSS? Jeśli ustawię class="redLabel", nie będzie to interpretować i sprawi, że etykieta będzie czerwona. Muszę użyć wbudowanych stylów w moim stole, aby to zadziałało. Jakieś pomysły?Eksportuj tabelę HTML, aby wypromować i zachować style CSS.

Odpowiedz

6

O ile mi wiadomo, większość programów pakietu Office NIE obsługuje dołączonej stylizacji, ale tylko stylizację śródliniową.

Jest prawdopodobne, że będziesz musiał umieścić swoją stylizację w linii (eksportowanie bani, prawie jak stylizacja poczty).

2

Excel obsługuje za pomocą CSS stylizacji, ale tylko wtedy, gdy istnieje jedna klasa na elemencie. Jeśli istnieje wiele klas, to nie będzie żadnego stylu na elemencie, zobacz CSS style class not combining in Excel

Po tym wszystkim, jest to kod, który łączę wszystkie style na stronie i eksportuję tabelę HTML. To brutalna siła, chwytaj wszystko, ale prawdopodobnie możesz sparować ją, jeśli znasz specyfikę. Funkcja zwraca obietnicę jQuery. Z tego możesz zrobić cokolwiek z wynikiem.

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>"; 
       }); 
    } 
} 
1

Możesz eksportować tabelę z zewnętrznym stylem CSS. Oto moje rozwiązanie zgłoś szablon dokumentu:

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>" 
     }; 
Powiązane problemy