2011-08-22 36 views
5

Tôi muốn tạo thả xuống Vaadin với 2 dấu phân tách trong đó. Tôi không thể tìm cách để thực hiện điều đó, bất cứ ai có thể giúp tôi giải quyết vấn đề này?Hộp tổ hợp Vaadin

Đây là cách tôi muốn hiển thị thả tôi xuống:

  • Lựa chọn 1
  • Lựa chọn 2
  • ------------;
  • chọn 1
  • chọn 2
  • -----------;
  • nhóm 1

Tôi làm như thế nào?

+0

Tạo tiện ích con bằng cách sử dụng mã hộp combo của Vaadin. Bạn có thể ghi đè lên vị trí mà nội dung HTML được lọc ra ở phía máy khách và sử dụng thẻ br để thêm dòng. – MarterJay

Trả lời

4

Không có cách tích hợp để thêm dấu phân cách để chọn. Cách duy nhất tôi có thể nghĩ đến là thêm một mục có dấu phân tách mong muốn làm chú thích của nó. Ví dụ: nếu bạn sử dụng chú thích mặc định (id mục) select.addItem("-----"); là đủ. Điều này sẽ làm việc cho cả ComboBoxes và NativeSelects.

3

Bạn có thể triển khai thành phần Vaadin mới bao gồm hành vi của ứng dụng khách, nhưng đây không phải là giải pháp dễ dàng. Trang này https://vaadin.com/book/-/page/gwt.html của "Sách Vaadin" và diễn đàn Vaadin có thể giúp ích cho điều đó.

Ngoài ra, việc tạo thành phần của riêng bạn bằng các thành phần hiện có là một giải pháp khác. Bạn có thể thực hiện một combobox đặc biệt nhận các giá trị của các mảng String hoặc Component. Cách thực hiện điều này là sử dụng các bảng, bố trí và cửa sổ của Vaadin với kích thước và vị trí và nhấp vào trình nghe.

0

Bạn luôn có thể làm

{select.addItem ("-----");}

Một khi tôi cũng muốn có một cái gì đó làm như thế nhưng không có cách thích hợp để làm điều đó với Vaadin. Tôi thực sự tạo ra một widget Vaadin mở rộng Combo Box. Trong phần phụ phía máy khách của Vaadin, chúng lọc ra nội dung HTML trước khi thêm các mục vào danh sách. Vì vậy, Sử dụng mã phía máy khách, tôi ghi đè chức năng đó và sử dụng thẻ HTML "
" để thêm dòng.

0
select.addItem("-----"); 

trông giống như là cách tốt nhất, tôi không biết về một số khác

Btw nếu bạn đang đọc mục từ một số danh sách mà bạn có thể kết hợp điều đó với một số mặt hàng truy cập và (itemsCount%n)==0 điều hành để thiết lập phân cách sau 'n' mặt hàng được chèn :)

0

Bạn có thể thêm các mục vào chọn (như đã đề cập trước đó) và sau đó vô hiệu hóa các thiết bị tách với một số javascript:

  1. thêm mục vào mục chọn. cb.addItem ("dấu tách"); cb.setItemCaption ("dấu tách", "-------------");

  2. thực thi javascript

    Chuỗi thức javascript = ""

    • "var chọn = document.getElementsByTagName ('chọn');"
    • "cho (var j = 0; j < selects.length; j ++) {"
    • "var op = selects [j] .getElementsByTagName ('option');"
    • "cho (var i = 0; i < op.length; i ++) {"
    • "if (op [i] .text == '" + separatorText + "') op [i] .disabled = thật;"
    • "}}"; Page.getCurrent(). GetJavaScript(). Execute (javascript);
Các vấn đề liên quan