Có vẻ như thanh công cụ mặc định cho jqGrid luôn ở dưới cùng. Các nút như trang Tiếp theo/Trước và menu thả xuống để chọn số hàng trên mỗi trang sẽ luôn hiển thị ở cuối lưới.Thêm nút vào jqGrid thanh công cụ trên cùng
Tôi tìm thấy cách thêm thanh công cụ trên cùng tùy chỉnh và nhấn nút tùy chỉnh vào thanh công cụ.
Điều thực sự cần là một cách để thêm chức năng mặc định (như phân trang) lên đầu lưới, thay vì dưới cùng.
Tôi không hiểu tại sao việc thanh công cụ trên cùng lại quan trọng đến mức rất quan trọng. Bạn không sử dụng phân trang hoặc phải có nhiều hàng trong lưới, mà một trong những không thể nhìn thấy thanh công cụ phía dưới mà không cần di chuyển? Hoặc có một lý do khác?
Có tham số boolean toppager của jqGrid (xem setting options for the grid) để tạo thêm máy nhắn tin hàng đầu. Bạn có thể hiển thị thanh công cụ xem thông số thanh công cụ, nhưng tôi không chắc chắn rằng bạn sử dụng cùng một thuật ngữ như jqGrid. Xem demo trên jqGrid Demos (mở rộng "Mới trong phiên bản 3.1"). Có lẽ bạn có nghĩa là một thanh điều hướng?
Nói chung jqGrid sẽ hiển thị đoạn HTML và chia tất cả với một số phần tử div được xác định trước. Thanh điều hướng sẽ được đặt bên trong div với id = "pg_pager" và class = "ui-pager-control". Bạn có thể thao tác jqGrid đối với jQuery ví dụ để di chuyển div này ở vị trí khác. Nếu bạn thực hiện chuyển động như vậy, bạn nên làm lại điều này mỗi lần bên trong xử lý sự kiện gridComplete (hoặc sau khi một sự kiện hoàn thành khác được kích hoạt).
CHỈNH SỬA: Dễ dàng di chuyển đoạn HTML hiện tại đến một địa điểm khác liên quan đến jQuery('#element_to_be_moved').insertAfter('#existing_element') hoặc jQuery('#element_to_be_moved').insertBefore('#existing_element'). Trong jqGrid footer cells "inherits" CSS from cells in the main grid Tôi mô tả tên của một số quan trọng của div là một phần của jqGrid. Tôi chúc bạn thành công trong việc viết mã.
Tôi đã nâng cấp lên jqgrid 3.7.2, với hy vọng thông số toppager của nó sẽ hữu ích. Trong khi nó đặt các điều khiển phân trang lên đầu, nút tìm kiếm đã không đi cùng cho chuyến đi.
// assuming a jqgrid with id='the_grid'
$('#the_grid_pager_left').clone(true).insertBefore('#the_grid_toppager_center')
ở trên, với một số tinh chỉnh CSS nhỏ, sao chép các nút tìm kiếm/refresh vào toppager là tốt, và bảo quản các sự kiện của họ/hành vi.
Thưởng thức:
$('#datagridnav').insertBefore('#t_datagrid'); //relocate footer to top
Để có thanh công cụ ở phía trên cùng của lưới điện với các nút và các sự kiện tương tự như thanh công cụ phía dưới bạn phải kích hoạt toppager:true với định nghĩa của lưới điện và thêm các dòng tiếp theo sau định nghĩa
/** Duplicating the Nav Toolbar in top **/
var toolbarClone = $('#pager_left').clone(true);
// Assuming that your grid's ID is myGrid
$('#myGrid_toppager_left').prepend(toolbarClone);
những dòng sẽ làm các trick :)
Oleg ... Nhìn vào Demo mới trong phiên bản 3.1, tôi dường như không thể lặp lại ví dụ này. DIV được định nghĩa ở đâu? – Bean
@Bean: Nếu tôi hiểu đúng câu hỏi của bạn, bạn cần thêm thanh công cụ 'toolbar: [true," top "]' hoặc ': [true," both "]' vào lưới. Nó tạo thanh công cụ * trên * lưới hoặc * dưới * lưới. Id của thanh công cụ trên cùng sẽ được tạo từ "t_" và lưới. Id của thanh công cụ phía dưới sẽ là 'tb_' + gridid. – Oleg