Làm cách nào để có được theader
trên jqGrid bằng jQuery?jqGrid nhận "th" và "thead" bằng cách sử dụng jQuery
Trả lời
Nếu một thead
và th
tồn tại trên DOM, nó có thể được chọn. Bạn có một ví dụ về những gì bạn đang cố gắng làm?
Hãy thử:
jQuery("thead", "#mygrid")
trả lời ngắn gọn của tôi là: thay vì chọn các yếu tố DOM tương ứng <th>
yếu tố mà bạn đang tìm kiếm bạn nên sử dụng
$("#list")[0].grid.headers
Nó trả về mảng này Các phần tử DOM, tương ứng với <th>
. Mô tả dài của câu trả lời của tôi sau.
Tôi hiểu lý do câu hỏi của bạn. Nếu bạn đã ví dụ xác định một phần cơ sở của jqGrid như
<table id="list"></table>
<div id="pager"></div>
sau đó $("#list")
mang đến cho bạn <table>
chỉ với "dữ liệu" một phần của lưới mà không tiêu đề. Phần "dữ liệu" chính của bảng sẽ được đặt bên trong một số div. Các phần tử khác của jqGrid sẽ được đặt trong các div như một bảng. Cấu trúc của jqGrid (không đầy đủ) sẽ trông giống như sau:
div.ui-jqgrid#gbox_list
div.ui-jqgrid-view#gview_list
div.ui-jqgrid-titlebar - caption
div.ui-userdata#t_list - optional top toolbar
div.ui-jqgrid-toppager#list_toppager - optional top pager
div.ui-jqgrid-hdiv - all grid headers
div.ui-jqgrid-hbox - (div.ui-jqgrid-hbox-rtl) if direction:"rtl"
table.ui-jqgrid-htable
thead
tr.ui-jqgrid-labels - row with column headers (labels)
th#list_rn - optional column header with row numbers
th#list_Col1 - column header for the column name:"Col1"
...
th#list_level - optional column header for some other
special columns in case of usage TreeGrid
the hidden columns of TreeGrid are: level,
parent, isLeaf, expanded, loaded, icon
tr.ui-search-toolbar - row for toolbar searching
th
th
...
div.frozen-div.ui-jqgrid-hdiv - optional frozen headers
table.ui-jqgrid-htable - table with frozen columns headers only
...
div.ui-jqgrid-bdiv - div with the main grid data
div
table#list - table with the main grid data
div.frozen-bdiv.ui-jqgrid-bdiv - optional div with the main grid data
div
table#list_frozen - table with the main grid data
div.ui-userdata#tb_list - optional bottom toolbar
div.ui-jqgrid-resize-mark#rs_mlist
div.ui-jqgrid-pager#pager - the div with the pager
(ở đây trong bảng tôi đã sử dụng rownumbers: true
, vì vậy có th#list_rn
, cột đầu tiên có tên 'col1', vì vậy có th#list_Col1
và do đó trên)
Bạn có thể thấy, đó là tiêu đề bảng table.ui-jqgrid-htable
lon có hai con <tr>
các bổ sung: một tr.ui-jqgrid-labels
cho các tiêu đề cột và một tr.ui-search-toolbar
cho filterToolbar
.
Đề xuất của tôi cho bạn không sử dụng cấu trúc phân cấp tương đối phức tạp này, nhưng sử dụng một cách ẩn ngắn khác hiện có trong jqGrid. Mã số
var gridDom = $("#list")[0];
cho bạn phần tử DOM của phần tử bảng. Phần tử này có một số phần mở rộng quan trọng được tạo bởi jqGrid. Đây là gridDom.p
chứa tất cả các tham số của jqGrid. Một mở rộng quan trọng là gridDom.grid
với những đặc tính quan trọng bDiv
, cDiv
, hDiv
, fbDiv
, fhDiv
, uDiv
và cũng cols
, footers
, topDiv
và headers
. Tôi khuyên bạn nên sử dụng mảng gridDom.grid.headers
làm cách tốt nhất để nhận danh sách các phần tử <th>
từ tiêu đề cột lưới (từ hàng chính xác <tr>
).
- 1. Chèn th thead
- 2. jquery thêm <thead> và thêm <tbody>
- 3. Khoảng cách giữa các thead và tbody
- 4. Cách nhận url trang trước bằng cách sử dụng jquery
- 5. lấy dữ liệu hàng bằng cách sử dụng jquery bằng cách nhấp vào các nút cho hàng đó
- 6. Hộp thoại phương thức jQuery và jqGrid
- 7. cách tạo jqGrid sử dụng jsp
- 8. Nhận URL hiện tại bằng cách sử dụng Jquery
- 9. JQuery - Nhận giá trị bằng cách sử dụng bộ chọn
- 10. Cách tạo gói không phải TH từ mã được tạo bằng cách sử dụng Mẫu Haskell?
- 11. Tạo bảng HTML khi đang chạy bằng cách sử dụng jQuery
- 12. Sử dụng jQuery tableSorter plugin với Angularjs
- 13. Nhiều thiết kế thead/tbody
- 14. Tại sao đường viền của <th> và <thead> đều không hiển thị ở đây?
- 15. Vòng lặp và nhận cặp khóa/giá trị cho mảng JSON bằng cách sử dụng jQuery
- 16. Lặp qua từng cột trong bảng HTML và nhận dữ liệu bằng cách sử dụng jQuery
- 17. Kéo và thả bằng cách sử dụng jQuery
- 18. Đếm chữ và ký tự bằng cách sử dụng jQuery
- 19. ASP.NET ListView - Render THEAD/TBODY Thẻ
- 20. Làm cách nào để tìm "vị trí trực quan" của mỗi ô trong bảng bằng cách sử dụng jQuery?
- 21. jqGrid ném "Lỗi cú pháp không bắt buộc, biểu thức không được công nhận: #"
- 22. Cố định <thead> trong <table>
- 23. Để nhận giá trị của một TD sử dụng JQuery
- 24. C# create thead và tbody
- 25. Chuyển hướng bằng cách sử dụng jQuery
- 26. Cách nhận số hàng cho jqGrid?
- 27. thead với một td (chiều rộng đầy đủ) và tbody với 2 cột (chiều rộng không phụ thuộc vào thead)
- 28. Làm cách nào để có Gridview hiển thị THEAD?
- 29. jqGrid số định dạng sử dụng
- 30. Đánh dấu bằng cách sử dụng jQuery
Tôi chỉ có một từ. Tuyệt vời... –