Jak mogę wyeksportować tabele do programu Excel ze strony internetowej. Chcę, aby eksport zawierał całe formatowanie i kolory.
<td style="background-color: ...
Jak mogę wyeksportować tabele do programu Excel ze strony internetowej. Chcę, aby eksport zawierał całe formatowanie i kolory.
<td style="background-color: ...
Odpowiedzi:
Najczystszym i najłatwiejszym eksportem z tabel do Excela jest wtyczka Jquery DataTables Table Tools. Otrzymujesz siatkę, która sortuje, filtruje, porządkuje i stronuje dane, a dzięki zaledwie kilku dodatkowym wierszom kodu i dwóm małym plikom, możesz eksportować do Excela, PDF, CSV, do schowka i na drukarkę.
To jest cały wymagany kod:
$(document).ready( function () {
$('#example').dataTable( {
"sDom": 'T<"clear">lfrtip',
"oTableTools": {
"sSwfPath": "/swf/copy_cvs_xls_pdf.swf"
}
} );
} );
Tak więc, szybkie wdrożenie, brak ograniczeń przeglądarki, brak języka po stronie serwera, a przede wszystkim bardzo ŁATWA do zrozumienia. To wygrana-wygrana. Jedyną rzeczą, na którą ma ograniczenia, jest ścisłe formatowanie kolumn.
Jeśli formatowanie i kolory są absolutnymi przełomami, jedyną w 100% niezawodną metodą między przeglądarkami, jaką znalazłem, jest użycie języka po stronie serwera do przetwarzania odpowiednich plików Excela z twojego kodu. Moim wyborem jest PHPExcel. Jest to jedyne, jakie do tej pory znalazłem, które pozytywnie obsługuje eksport z formatowaniem do NOWOCZESNEJ wersji Excela z dowolnej przeglądarki, jeśli dajesz tylko HTML. Pozwólcie mi jednak wyjaśnić, że zdecydowanie nie jest to tak łatwe, jak pierwsze rozwiązanie, a także jest trochę kłopotliwe. Jednak z drugiej strony może również wyświetlać bezpośrednio w formacie PDF. A po skonfigurowaniu po prostu działa za każdym razem.
AKTUALIZACJA - 15 września 2016 r .: TableTools zostało wycofane na korzyść nowej wtyczki o nazwie „ przyciski ”. Narzędzia te pełnią te same funkcje, co stare rozszerzenie TableTools, ale są DUŻO łatwiejsze w instalacji i wykorzystują pliki HTML5 do pobrania dla nowoczesnych przeglądarek, z możliwością powrotu do oryginalnego pobierania Flasha w przeglądarkach, które nie obsługują standardu HTML5. Jak widać z wielu komentarzy od czasu, gdy opublikowałem tę odpowiedź w 2011 roku, główna słabość TableTools została naprawiona. Nadal nie mogę polecić DataTables wystarczająco do obsługi dużych ilości danych, zarówno dla programisty, jak i użytkownika.
Dawno temu odkryłem, że Excel otworzy plik HTML z tabelą, jeśli wyślemy go z typem zawartości Excel. Rozważ powyższy dokument:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Java Friends</title>
</head>
<body>
<table style="font-weight: bold">
<tr style="background-color:red"><td>a</td><td>b</td></tr>
<tr><td>1</td><td>2</td></tr>
</table>
</body>
</html>
Uruchomiłem na nim następującą bookmarklet:
javascript:window.open('data:application/vnd.ms-excel,'+document.documentElement.innerHTML);
i faktycznie mam go do pobrania jako plik Excel. Jednak nie uzyskałem oczekiwanego rezultatu - plik był otwarty w OpenOffice.org Writer. To jest mój problem: nie mam Excela na tym komputerze, więc nie mogę go lepiej wypróbować. Ponadto ta sztuczka działała mniej więcej sześć lat temu w starszych przeglądarkach i starszej wersji MS Office, więc naprawdę nie mogę powiedzieć, czy zadziała dzisiaj.
W każdym razie w powyższym dokumencie dodałem przycisk, który teoretycznie ściągałby cały dokument jako plik Excel:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Java Friends</title>
</head>
<body>
<table style="font-weight: bold">
<tr style="background-color:red"><td>a</td><td>b</td></tr>
<tr><td>1</td><td>2</td></tr>
<tr>
<td colspan="2">
<button onclick="window.open('data:application/vnd.ms-excel,'+document.documentElement.innerHTML);">
Get as Excel spreadsheet
</button>
</td>
</tr>
</table>
</body>
</html>
Zapisz go w pliku i kliknij przycisk. Ja kocham wiedzieć, czy to działa, czy nie, więc proszę was, aby skomentować nawet do stwierdzenia, że to nie działa.
document.getElementById('id').innerHTML
aby wybiórczo pobrać tylko tabelę, w przeciwnym razie wszystkie twoje rzeczy zostaną wyeksportowane do arkusza kalkulacyjnego. Nie działa jednak w starym IE, po prostu otwiera nowe okno z całym html w tytule
Możliwe jest użycie starego formatu XML programu Excel 2003 (przed OpenXML) do utworzenia ciągu zawierającego żądany XML, a następnie po stronie klienta można użyć identyfikatora URI danych do otwarcia pliku przy użyciu typu MIME XSL lub wysłania pliku do klienta przy użyciu typu MIME programu Excel „Content-Type: application / vnd.ms-excel” po stronie serwera.
<script type="text/javascript">
var worksheet_template = '<?xml version="1.0"?><ss:Workbook xmlns:ss="urn:schemas-microsoft-com:office:spreadsheet">'+
'<ss:Styles><ss:Style ss:ID="1"><ss:Font ss:Bold="1"/></ss:Style></ss:Styles><ss:Worksheet ss:Name="Sheet1">'+
'<ss:Table>{{ROWS}}</ss:Table></ss:Worksheet></ss:Workbook>';
var row_template = '<ss:Row ss:StyleID="1"><ss:Cell><ss:Data ss:Type="String">{{name}}</ss:Data></ss:Cell></ss:Row>';
</script>
<script type="text/javascript">
var rows = document.getElementById("my-table").getElementsByTagName('tr'),
row_data = '';
for (var i = 0, length = rows.length; i < length; ++i) {
row_data += row_template.replace('{{name}}', rows[i].getElementsByTagName('td')[0].innerHTML);
}
</script>
Po zebraniu informacji utwórz końcowy ciąg i otwórz nowe okno, używając identyfikatora URI danych
<script type="text/javascript"> var worksheet = worksheet_template.replace('{{ROWS}}', row_data);
window.open('data:application/vnd.ms-excel,'+worksheet); </script>
Warto zauważyć, że starsze przeglądarki nie obsługują schematu URI danych, więc może być konieczne utworzenie strony serwera plików dla tych przeglądarek, które go nie obsługują.
Może być również konieczne wykonanie kodowania base64 na zawartości identyfikatora URI danych, co może wymagać biblioteki js , a także dodanie ciągu „; base64” po typie MIME w identyfikatorze URI danych.
Excel ma mało znaną funkcję zwaną „kwerendami sieci Web”, która umożliwia pobieranie danych z prawie każdej strony internetowej bez dodatkowego programowania.
Kwerenda sieci Web zasadniczo uruchamia żądanie HTTP bezpośrednio z programu Excel i kopiuje niektóre lub wszystkie otrzymane dane (i opcjonalnie formatowanie) do arkusza.
Po zdefiniowaniu zapytania internetowego możesz je odświeżyć w dowolnym momencie, nawet bez opuszczania programu Excel. Nie musisz więc faktycznie „eksportować” danych i zapisywać ich w pliku - wolisz raczej odświeżyć dane, tak jak z bazy danych.
Możesz nawet skorzystać z parametrów adresu URL, wyświetlając monit programu Excel o określone kryteria filtrowania itp.
Jednak wady, które do tej pory zauważyłem, to:
Oto pytanie dotyczące tworzenia zapytań sieci Web w programie Excel. Zawiera łącze do witryny pomocy firmy Microsoft dotyczącej pobierania danych zewnętrznych ze strony sieci Web
To jest php, ale możesz zmienić go na javascript:
<?php>
$colgroup = str_repeat("<col width=86>",5);
$data = "";
$time = date("M d, y g:ia");
$excel = "<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\">
<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">
<html>
<head>
<meta http-equiv=\"Content-type\" content=\"text/html;charset=utf-8\" />
<style id=\"Classeur1_16681_Styles\">
.xl4566 {
color: red;
}
</style>
</head>
<body>
<div id=\"Classeur1_16681\" align=center x:publishsource=\"Excel\">
<table x:str border=0 cellpadding=0 cellspacing=0 style=\"border-collapse: collapse\">
<colgroup>$colgroup</colgroup>
<tr><td class=xl2216681><b>Col1</b></td><td class=xl2216681><b>Col2</b></td><td class=xl2216681 ><b>Col3</b></td><td class=xl2216681 ><b>Col4</b></td><td class=xl2216681 ><b>Col5</b></td></tr>
<tr><td class=xl4566>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
</table>
</div>
</body>
</html>";
$fname = "Export".time().".xls";
$file = fopen($fname,"w+");
fwrite($file,$excel);
fclose($file);
header('Content-Type: application/vnd.ms-excel');
header('Content-Disposition: attachment; filename="'.basename($fname).'"');
readfile($fname);
unlink($fname); ?>
Po pierwsze, nie polecałbym próbować eksportować HTML i mam nadzieję, że wystąpienie Excela użytkownika je odbierze. Z mojego doświadczenia wynika, że to rozwiązanie jest pełne problemów, w tym niekompatybilności z klientami Macintosh i zgłaszania użytkownikowi błędu, że dany plik nie ma określonego formatu. Najbardziej niezawodnym i przyjaznym dla użytkownika rozwiązaniem jest rozwiązanie po stronie serwera, w którym używa się biblioteki do tworzenia rzeczywistego pliku Excela i wysyłania go z powrotem do użytkownika. Kolejnym najlepszym i bardziej uniwersalnym rozwiązaniem byłoby użycie formatu Open XML. Napotkałem kilka rzadkich problemów ze zgodnością ze starszymi wersjami programu Excel, ale ogólnie powinno to dać rozwiązanie, które będzie działać na każdej wersji programu Excel, w tym na komputerach Mac.
Mozilla nadal obsługuje podstawowe 64 identyfikatory URI. Pozwala to na dynamiczne komponowanie zawartości binarnej za pomocą javascript:
<a href="data:application/vnd.ms-excel<base64 encoded binary excel content here>"> download xls</a>
jeśli twój plik Excela nie jest zbyt wyszukany (bez diagramów, formuł, makr) możesz zagłębić się w format i skomponować bajty dla swojego pliku, a następnie zakodować je za pomocą base64 i wstawić do href
W rzeczywistości jest to prostsze niż myślisz: „Po prostu” skopiuj tabelę HTML (to znaczy: kod HTML tabeli) do schowka. Excel wie, jak dekodować tabele HTML; będzie nawet próbował zachować atrybuty.
Najtrudniejsze jest „skopiowanie tabeli do schowka”, ponieważ nie ma standardowego sposobu dostępu do schowka z JavaScript. Zobacz ten wpis na blogu: Dostęp do schowka systemowego za pomocą JavaScript - Święty Graal?
Teraz wszystko, czego potrzebujesz, to tabela w formacie HTML. Proponuję jQuery i metodę html () .
Ten kod to tylko IE, więc jest przydatny tylko w sytuacjach, w których wiesz, że wszyscy twoi użytkownicy będą używać IE (na przykład w niektórych środowiskach korporacyjnych).
<script Language="javascript">
function ExportHTMLTableToExcel()
{
var thisTable = document.getElementById("tbl").innerHTML;
window.clipboardData.setData("Text", thisTable);
var objExcel = new ActiveXObject ("Excel.Application");
objExcel.visible = true;
var objWorkbook = objExcel.Workbooks.Add;
var objWorksheet = objWorkbook.Worksheets(1);
objWorksheet.Paste;
}
</script>
Założenia:
podany adres URL
konwersję należy przeprowadzić po stronie klienta
systemy to Windows, Mac i Linux
Rozwiązanie dla systemu Windows:
kod Pythona, który otwiera okno ie i ma do niego dostęp: zmienna url zawiera adres url ('http: //')
ie = Dispatch("InternetExplorer.Application")
ie.Visible = 1
ie.Navigate(theurl)
Uwaga: jeśli strona nie jest dostępna bezpośrednio, ale zaloguj się, będziesz musiał sobie z tym poradzić, wprowadzając dane formularza i emulując działania użytkownika za pomocą Pythona
oto przykład
from win32com.client import Dispatch
ie.Document.all('username').value=usr
ie.Document.all('password').value=psw
ten sam sposób w przypadku pobierania danych ze strony internetowej. Powiedzmy, że element o identyfikatorze „el1” zawiera dane. pobrać tekst elementu do zmiennej
el1 = ie.Document.all('el1').value
wtedy, gdy dane są w zmiennej Python, możesz otworzyć ekran programu Excel w podobny sposób, używając pythona:
from win32com.client import Dispatch
xlApp = Dispatch("Excel.Application")
xlWb = xlApp.Workbooks.Open("Read.xls")
xlSht = xlWb.WorkSheets(1)
xlSht.Cells(row, col).Value = el1
Rozwiązanie dla komputerów Mac:
tylko wskazówka: użyj AppleScript - ma proste i podobne API jak win32com.client Dispatch
Rozwiązanie dla systemu Linux:
java.awt.Robot może działać w tym przypadku ma kliknięcie, naciśnięcie klawisza (można użyć klawiszy skrótu), ale żaden API dla Linuksa, o którym wiem, nie działa tak prosto jak AppleScript
proste wyszukiwanie google okazało się takie:
Jeśli dane są w rzeczywistości stroną HTML i NIE zostały utworzone przez ASP, PHP lub inny język skryptowy, a używasz przeglądarki Internet Explorer 6 i masz zainstalowany program Excel na swoim komputerze, po prostu kliknij stronę prawym przyciskiem myszy i zobacz poprzez menu. Powinien pojawić się komunikat „Eksportuj do programu Microsoft Excel”. Jeśli wszystkie te warunki są spełnione, kliknij element menu i po kilku pytaniach zostanie zaimportowany do programu Excel.
jeśli nie możesz tego zrobić, podaje alternatywną metodę „przeciągnij i upuść”:
Istnieją praktyczne dwa sposoby zrobienia tego automatycznie, podczas gdy tylko jedno rozwiązanie może być używane we wszystkich przeglądarkach. Przede wszystkim do zbudowania arkusza Excela należy użyć specyfikacji open xml. Dostępne są bezpłatne wtyczki firmy Microsoft, które udostępniają ten format również dla starszych wersji biurowych. Otwarty xml jest standardem od Office 2007. Te dwa sposoby są oczywiste po stronie serwera lub po stronie klienta.
Implementacja po stronie klienta wykorzystuje nowy standard CSS, który pozwala na przechowywanie danych zamiast tylko adresu URL do danych. To świetne podejście, ponieważ nie potrzebujesz żadnego połączenia z serwerem, tylko dane i trochę javascript. Morderczym minusem jest to, że Microsoft nie obsługuje wszystkich jego części w obecnych wydaniach IE (nie wiem o IE9). Microsoft ogranicza dane do obrazu, ale będziemy potrzebować dokumentu. W firefox działa całkiem dobrze. Dla mnie IE był punktem śmierci.
Innym sposobem jest użycie implementacji po stronie serwera. Powinno być wiele implementacji otwartego XML dla wszystkich języków. Musisz tylko jednego złapać. W większości przypadków będzie to najprostszy sposób zmodyfikowania modelu widoku w celu uzyskania dokumentu, ale na pewno można wysłać wszystkie dane z witryny klienta z powrotem na serwer i zrobić to samo.
function normalexport() {
try {
var i;
var j;
var mycell;
var tableID = "tblInnerHTML";
var drop = document.getElementById('<%= ddl_sections.ClientID %>');
var objXL = new ActiveXObject("Excel.Application");
var objWB = objXL.Workbooks.Add();
var objWS = objWB.ActiveSheet;
var str = filterNum(drop.options[drop.selectedIndex].text);
objWB.worksheets("Sheet1").activate; //activate dirst worksheet
var XlSheet = objWB.activeSheet; //activate sheet
XlSheet.Name = str; //rename
for (i = 0; i < document.getElementById("ctl00_ContentPlaceHolder1_1").rows.length - 1; i++) {
for (j = 0; j < document.getElementById("ctl00_ContentPlaceHolder1_1").rows(i).cells.length; j++) {
mycell = document.getElementById("ctl00_ContentPlaceHolder1_1").rows(i).cells(j);
objWS.Cells(i + 1, j + 1).Value = mycell.innerText;
// objWS.Cells(i + 1, j + 1).style.backgroundColor = mycell.style.backgroundColor;
}
}
objWS.Range("A1", "L1").Font.Bold = true;
// objWS.Range("A1", "L1").Font.ColorIndex = 2;
// objWS.Range("A1", "Z1").Interior.ColorIndex = 47;
objWS.Range("A1", "Z1").EntireColumn.AutoFit();
//objWS.Range("C1", "C1").ColumnWidth = 50;
objXL.Visible = true;
} catch (err) {
alert("Error. Scripting for ActiveX might be disabled")
return
}
idTmr = window.setInterval("Cleanup();", 1);
}
function filterNum(str) {
return str.replace(/[ / ]/g, '');
}