Hướng dẫn export excel table jquery - xuất bảng excel jquery

table2excel là một plugin của jQuery giúp bạn xuất dữ liệu trong bảng HTML sang file Excel. Các bước cài đặt plugin đơn giản và nhanh chóng giúp bạn chuyển đổi dữ liệu một cách dễ dàng. là một plugin của jQuery giúp bạn xuất dữ liệu trong bảng HTML sang file Excel. Các bước cài đặt plugin đơn giản và nhanh chóng giúp bạn chuyển đổi dữ liệu một cách dễ dàng.

Các bước sử dụng:
  1. Thêm thư viện jQuery, sau đó thêm jQuery table2excel plugin vào file HTML như sau:
    jQuery, sau đó thêm jQuery table2excel plugin vào file HTML như sau: 
  2. Tạo button Export để xuất dữ liệu. Các bạn có thể dùng cách khác thay cho sử dụng button:
    Export
    Export để xuất dữ liệu. Các bạn có thể dùng cách khác thay cho sử dụng button:
    Export
  3. Gọi function đối với table để tiến hành xuất dữ liệu:
    $["button"].click[function[]{
      $["#table2excel"].table2excel[{
        // exclude CSS class
        exclude: ".noExl",
        name: "Worksheet Name",
        filename: "SomeFile" //do not include extension
      }]; 
    }];
  4. Bạn có thể thêm CSS class noExl cho các thẻ tr để bỏ qua việc xuất dữ liệu cho bảng đó:
    
      #
      Column heading
      Column heading
      Column heading
    
    noExl cho các thẻ tr để bỏ qua việc xuất dữ liệu cho bảng đó:
    
      #
      Column heading
      Column heading
      Column heading
    

Các bạn có thể download và xem hướng dẫn sử dụng ở đây

Nguồn: //www.jqueryscript.net/table/Export-Html-Table-To-Excel-Spreadsheet-using-jQuery-table2excel.html

Khi xuất xuất html bảng ra tệp excel, trong nhiều trường hợp c gan bạn sẽ gặp vấn Chỉ .Ví dụ bàn:
Giả sử tôi sử dụng thư viện Jquery Table2Excel để export HTML table ra file excel.
Ví dụ table:

Khi xuất ra file excel thông thường ta sẽ có kết quả như sau:

Các trường số điện thoại bị format thành number và tự loại bỏ số 0 ở đầu, trong khi trường dữ liệu có dạng như 12/20 bị format thành định dạng ngày tháng.Để giữ nguyên dạng text cho các ô này, ta thêm thuộc tính CSS cho ô đó trong table như sau:
Để giữ nguyên dạng text cho các ô này, ta thêm thuộc tính CSS cho ô đó trong table như sau:

    <td style='mso-number-format:"\@"'>0912222222</td>

Tương tự như vậy ta có nhiều giá trị khác có thể thiết lập cho thuộc tính

Export
3 để định dạng excel cell theo ý muốn. Các bạn tham khảo bảng sau và có thể tự thử nghiệm để hiểu rõ hơn.

mso-number-format:"0" // NO Decimals
mso-number-format:"0\.000" // 3 Decimals
mso-number-format:"\#\,\#\#0\.000"  // Comma with 3 dec
mso-number-format:"mm\/dd\/yy" // Date7
mso-number-format:"mmmm\ d\,\ yyyy"  // Date9
mso-number-format:"m\/d\/yy\ h\:mm\ AM\/PM" // D -T AMPM
mso-number-format:"Short Date" // 01/03/1998
mso-number-format:"Medium Date" // 01-mar-98
mso-number-format:"d\-mmm\-yyyy" // 01-mar-1998
mso-number-format:"Short Time" // 5:16
mso-number-format:"Medium Time" // 5:16 am
mso-number-format:"Long Time" // 5:16:21:00
mso-number-format:"Percent"  // Percent - two decimals
mso-number-format:"0%"   // Percent - no decimals
mso-number-format:"0\.E+00"  // Scientific Notation
mso-number-format:"\@" // Text
mso-number-format:"\#\ ???\/???" // Fractions - up to 3 digits [312/943]
mso-number-format:"\0022£\0022\#\,\#\#0\.00" // £12.76
mso-number-format:"\#\,\#\#0\.00_ \;\[Red\]\-\#\,\#\#0\.00\ " // 2 decimals, negative numbers in red and signed [1.56 -1.56]

Trong trường hợp bạn muốn table của bạn khi export ra excel màu mè một chút như hình dưới đây, giải pháp cho bạn chính là sử dụng inline CSS cho các thẻ th, td [tương ứng với các cell trong excel]

Ví dụ:

<th width="1%" style="background-color: #E4FFFA; border: 1px solid #f4f4f4; font-size: 14px">    
    <input type="checkbox" class="check-all">
</th>

Bảng2Excel là một plugin jQuery đơn giản nhưng hữu ích cho phép xuất dữ liệu bảng HTML sang tệp Excel.

Plugin thay thế:

  • Xuất bảng và dữ liệu JSON để xuất sắc với jQuery - exportToExcel
  • Xuất các bảng HTML sang CSV/XLS/XLSX/Text - JQuery TableExport
  • Bảng HTML sang Excel Converter - SaveaseXcel.js
  • Bảng bên máy khách đến plugin xuất Excel - jQuery excelgen

Xem thêm:

  • Chuyển đổi tệp CSV thành bảng dữ liệu
  • Tạo bảng từ tệp CSV - Trình phân tích cú pháp CSV
  • Bộ chuyển đổi dữ liệu CSV sang JSON với JQuery
  • CSV sang bảng chuyển đổi - csvtotable.js
  • Xuất dữ liệu JSON sang tệp CSV-CSV-Export

Làm thế nào để sử dụng nó:

1. Bao gồm thư viện jQuery và plugin JQuery Table2Excel trong tài liệu HTML.

2. Tạo nút 'Xuất' để xuất dữ liệu bảng sang tệp Excel theo cách thủ công. Không bắt buộc.

Export

3. Gọi plugin trên bảng và vượt qua các tùy chọn sau.

$["button"].click[function[]{
  $["#table2excel"].table2excel[{
    // exclude CSS class
    exclude: ".noExl",
    name: "Worksheet Name",
    filename: "SomeFile", //do not include extension
    fileext: ".xls" // file extension
  }]; 
}];

4. Sau đó, bạn có thể thêm lớp CSS 'NOEXL' vào bất kỳ thẻ

Export
4 nào để bỏ qua dữ liệu bảng được chỉ định trong khi xuất.


  #
  Column heading
  Column heading
  Column heading

5. Xác định xem có giữ được nền và màu phông chữ hay không. Mặc định: Sai.

Export
1

6. Xác định xem có nên loại trừ hình ảnh, liên kết và trường nhập. Mặc định: Đúng.

Export
2

Changelog:

2019-06-04

  • Đã thêm hỗ trợ cho màu nền và màu phông chữ trong các hàng và cột.

2019-02-07

  • v1.1.2: & nbsp; cập nhật jQuery.table2Excel.js

2017-05-26

  • v1.1.1: & nbsp; cập nhật jQuery.table2Excel.js

2016-03-08

  • Hỗ trợ tính năng Unicode và Tiện ích mở rộng tệp.

2015-05-22

  • Cập nhật jQuery.Table2Excel.js

2015-04-08

  • Đã thêm hỗ trợ IE11

2015-04-04

  • Các thay đổi được thực hiện để chuyển sang hỗ trợ nhiều bảng sang tệp excel đơn.

Plugin jQuery tuyệt vời này được phát triển bởi Rainabba. Để sử dụng nâng cao hơn, vui lòng kiểm tra trang demo hoặc truy cập trang web chính thức.

  • Trước: Plugin JQuery để chuyển đổi dữ liệu JSON thành bảng HTML - có thể gắn kết
  • Tiếp theo: plugin plugin/plugin tiêu đề bảng dính kiểu iOS theo kiểu

Bài Viết Liên Quan

Chủ Đề