Bộ lọc bảng Bootstrap theo phạm vi ngày

Đây là một tiện ích mở rộng cho plugin jquery bảng Bootstrap, dựa trên một tiện ích mở rộng khác Điều khiển bộ lọc bảng, cung cấp các điều khiển bộ lọc cột cho phía máy chủ và phía máy khách

Người giới thiệu

Chọn2 - v. 3 để chọn kiểm soát bộ lọc jQuery UI - v. 1. 10 cho kiểm soát bộ lọc datepicker

Ví dụ. Điều khiển đơn giản

Khởi tạo điều khiển bộ lọc bảng bootstrap cơ bản

Mặt hàng ID Mặt hàng Tên mặt hàng Giá mặt hàng Ngày

Ví dụ. điều khiển phạm vi

Điều khiển bộ lọc bảng Bootstrap khởi tạo với phạm vi

Nhớ. Tất cả các điều khiển phạm vi (input_range, select_rangedatepicker_range) chỉ dành cho phía máy chủ

Mặt hàng ID Mặt hàng Tên mặt hàng Giá mặt hàng Ngày

Đặt thành e. g. data-filter-control9 để cho phép bộ lọc đầu vào tùy chỉnh trong phần tử có id Boolean0. Mỗi phần tử bộ lọc (nhập hoặc chọn) phải có lớp sau Boolean1 (phải được thay thế bằng [Trường] đã xác định(https. //bootstrap-bảng. com/docs/api/column-options/#field) name)

  • Mặc định. false

  • bộ lọcDataCollector

    • Thuộc tính. Boolean3

    • loại. Boolean4

    • Chi tiết

      Thu thập dữ liệu sẽ được thêm vào bộ lọc đã chọn, để lọc qua e. g. các nhãn được phân tách bằng dấu phẩy và được hiển thị bằng bộ định dạng

    • Vỡ nợ. data-filter-control6

    bộ lọcKiểm soátNhiều Tìm kiếm

    • Thuộc tính. Boolean6

    • kiểu. Boolean7

    • Chi tiết

      Đặt thành true để cho phép tìm kiếm nhiều giá trị cùng một lúc
      Các giá trị sẽ được phân tách bằng dấu phân cách, xem tùy chọn Boolean9

    • Mặc định. false

    filterControlMultipleSearchDelimiter

    • Thuộc tính. true1

    • kiểu. data-filter-control2

    • Chi tiết

      Xác định dấu phân cách sẽ được sử dụng để phân chia các giá trị tìm kiếm trong tùy chọn Boolean9

    • Vỡ nợ. true4

    tìm kiếmOnEnterKey

    • Thuộc tính. true5

    • loại. Boolean

    • Chi tiết

      Đặt thành true để kích hoạt hành động tìm kiếm khi người dùng nhấn phím enter

    • Mặc định. false

    showFilterControlSwitch

    • Thuộc tính. true8

    • loại. Boolean

    • Chi tiết

      Đặt thành true để hiển thị nút công tắc điều khiển bộ lọc

    • Mặc định. false

    sắp xếpSelectOptions

    • Thuộc tính. input2

    • loại. Boolean

    • Chi tiết

      Đặt thành true để sắp xếp các thành phần tùy chọn của điều khiển chọn

    • Mặc định. false

    tùy chọn cột

    bộ lọcKiểm soát

    • Thuộc tính. data-filter-control

    • kiểu. data-filter-control2

    • Chi tiết

      Đặt input. hiển thị điều khiển đầu vào, select. hiển thị một điều khiển được chọn, select0. hiển thị một điều khiển datepicker html5

    • Vỡ nợ. data-filter-control6

    bộ lọcKiểm soátGiữ chỗ

    • thuộc tính. select2

    • kiểu. data-filter-control2

    • Chi tiết

      Đặt cài đặt này để chỉ hiển thị trình giữ chỗ trong điều khiển bộ lọc đầu vào

    • Mặc định. select4

    bộ lọcTìm kiếm tùy chỉnh

    • Thuộc tính. select5

    • loại. select6

    • Chi tiết

      Chức năng tìm kiếm tùy chỉnh được thực hiện thay vì chức năng tìm kiếm tích hợp, có bốn tham số

      • select7. văn bản tìm kiếm
      • select8. giá trị của cột để so sánh
      • select9. tên trường cột
      • false0. dữ liệu bảng

      Trả về false để lọc ra cột/hàng hiện tại. Trả về true để không lọc ra cột/hàng hiện tại. Quay lại false3 để bỏ qua tìm kiếm tùy chỉnh cho giá trị hiện tại

    • Vỡ nợ. data-filter-control6

    bộ lọcDữ liệu

    • Thuộc tính. false5

    • kiểu. data-filter-control2

    • Chi tiết

      Đặt giá trị bộ lọc chọn tùy chỉnh, sử dụng false7 để tải từ một biến false8 để tải từ một đối tượng false9 để tải từ tệp json từ xa data-filter-control-visible0 để tải từ chuỗi json. data-filter-control-visible1 để tải từ một chức năng

    • Vỡ nợ. data-filter-control6

    • Thuộc tính. data-filter-control-visible3

    • kiểu. data-filter-control-visible4

    • Chi tiết

      Nếu tùy chọn bộ chọn ngày được đặt, hãy sử dụng tùy chọn này để định cấu hình bộ chọn ngày với các tùy chọn gốc. Sử dụng cách này. data-filter-control-visible5. Để biết thêm thông tin, hãy truy cập tài liệu này

    • Vỡ nợ. data-filter-control6

    bộ lọcMặc định

    • Thuộc tính. data-filter-control-visible7

    • kiểu. data-filter-control2

    • Chi tiết

      Đặt giá trị mặc định của bộ lọc

    • Vỡ nợ. data-filter-control6

    bộ lọcOrderBy

    • thuộc tính. Boolean0

    • kiểu. data-filter-control2

    • Chi tiết

      Đặt tùy chọn này để sắp xếp các tùy chọn trong một điều khiển được chọn tăng dần (_______4_______2), giảm dần (Boolean3) hoặc theo thứ tự do máy chủ cung cấp (Boolean4)

      Làm cách nào để thêm bộ lọc trong bảng Bootstrap?

      Bộ lọc Bootstrap (Nâng cao) .
      Bộ lọc Bootstrap. Bootstrap không có thành phần cho phép lọc. .
      Bảng lọc. Thực hiện tìm kiếm không phân biệt chữ hoa chữ thường đối với các mục trong bảng. .
      Lọc danh sách. Thực hiện tìm kiếm không phân biệt chữ hoa chữ thường cho các mục trong danh sách. .
      Bộ lọc thả xuống

      Bộ lọc phạm vi ngày là gì?

      Sử dụng hàm tuần tự hóa asDateRange() để liên kết các bộ lọc dựa trên phạm vi ngày . Bạn có thể tạo bộ lọc bằng phạm vi ngày tuyệt đối hoặc tương đối. Nếu dữ liệu đầu vào là mảng một chiều có hai phần tử. Và cả hai yếu tố đều là số, CRM Analytics giả định rằng các số là một kỷ nguyên.