Điều khiển Combobox dựa trên jQuery chuyên nghiệp? [đóng cửa]


86

Có bất kỳ điều khiển Combobox chuyên nghiệp nào (danh sách thả xuống với tự động đề xuất) dựa trên thư viện jQuery không?

Nó sẽ có thể xử lý các tập dữ liệu lớn và có một số tùy chọn lột xác . Một danh sách kết quả nhiều cột cũng sẽ rất tuyệt. Tôi đang làm việc với ASP.NET, nhưng không thành vấn đề nếu tôi phải viết một trình bao bọc cho nó.

văn bản thay thế

Tôi đã sử dụng điều khiển của bên thứ ba, nhưng tôi đã gặp phải một số vấn đề về tính tương thích giữa điều khiển của hai nhà cung cấp. Tôi muốn loại bỏ kiểu phụ thuộc này.


bạn đã bao giờ có thể tìm thấy câu trả lời tốt hơn cho câu hỏi này chưa?
Phần tử

Hãy xem câu trả lời của GeorgeBarker bên dưới.
splattne

Combobox của jQuery được gọi là 'autocomplete.' jqueryui.com/autocomplete/#combobox
Aaron

Câu trả lời:


24

Thật không may, thứ tốt nhất tôi từng thấy là jquery.combobox , nhưng nó không thực sự giống thứ mà tôi thực sự muốn sử dụng trong các ứng dụng web của mình. Tôi nghĩ rằng có một số vấn đề về khả năng sử dụng với điều khiển này, nhưng với tư cách là người dùng, tôi không nghĩ rằng tôi nên bắt đầu nhập để danh sách thả xuống biến thành hộp văn bản.

Tôi thích Hộp thả xuống kết hợp hơn , nhưng nó vẫn có một số tính năng mà tôi muốn và nó vẫn ở dạng alpha. Điều duy nhất tôi không thích về điều này ngoài việc nó là alpha ... là khi tôi nhập vào hộp kết hợp, các mục gốc trong danh sách thả xuống sẽ biến mất. Tuy nhiên, có thể có một cài đặt cho điều này ... hoặc có thể nó có thể được thêm vào khá dễ dàng.

Đó là hai lựa chọn duy nhất mà tôi biết. Chúc may mắn trong việc tìm kiếm của bạn. Tôi muốn biết nếu bạn tìm thấy một hoặc nếu tùy chọn thứ hai phù hợp với bạn.


1
Tôi dường như có vấn đề tương thích với jquery.combobox và jQuery 1.4.x ... như với hầu hết các plugin chưa được duy trì trong một thời gian dài ...
Lukas Eder

3
Nhận xét về liên kết đầu tiên 'lưu ý: tại thời điểm này, jquery.combobox hoạt động như một danh sách thả xuống chứ không phải là một hộp lược đầy đủ. nó hiện không chấp nhận nhập văn bản. ' loại đánh bại mục đích IMO ....
Matthew Dresser

1
link chết tại sanchezsalvador.com
markashworth

53

Đây là một trong những có vẻ rất hứa hẹn. Đó là một sự kết hợp thực sự - bạn thấy những gì bạn nhập. Có một tính năng thú vị mà tôi chưa từng thấy ở nơi khác: kết quả phân trang.

FlexBox


Tôi sẽ thứ hai đề xuất FlexBox. Nó có kiểu dáng và tùy chọn giao diện người dùng rất, umm, linh hoạt.
Ben Griswold, 07/07/09

Phiên bản mới (0.9.3) vừa được phát hành. FlexBox hiện hỗ trợ lọc JSON phía máy khách.
Noah Heldman

1
imo FlexBox dành cho một số trường hợp quá mức cần thiết.
kajo

Dường như tải tất cả dữ liệu (json) cùng một lúc nên có thể không phù hợp nếu nguồn dữ liệu có nhiều bản ghi
David

Nếu tôi đã chọn một giá trị, sau đó nhấp vào mũi tên, nó chỉ hiển thị giá trị đã chọn, không phải tất cả giá trị.
linbo

24

Bất cứ ai đang tìm kiếm một "hộp kết hợp" jquery dường như đều hướng đến câu hỏi này. Bài đăng của tôi dành cho những người đến trang này để tìm một hộp kết hợp "truyền thống", chứ không phải là câu trả lời cho câu hỏi ban đầu. Tất cả các giải pháp trên đều tập trung vào việc sử dụng đầu vào làm phương tiện để lọc và tự động hoàn thành giá trị được chọn hiện có. (tuyệt vời cho bộ dữ liệu lớn)

Nếu bạn đang tìm kiếm hộp tổ hợp truyền thống, chỉ đơn giản là "Nhập nội dung nào đó hoặc chọn từ các giá trị được xác định trước này" (không, chúng tôi sẽ không ẩn các giá trị không khớp khi bạn đang nhập), tất cả những gì bạn có thể cần làm là

<select id="combo4" style="width: 200px;"
            onchange="$('input#text4').val($(this).val());">
    <option>option 1</option>
    <option>option 2</option>
    <option>option 3</option>
</select>
<input id="text4"
       style="margin-left: -203px; width: 180px; height: 1.2em; border: 0;" />

Xem http://bit.wisestamp.com/uncategorized/htmljquery-editable-combo-2/

Sẽ dễ dàng để gói nó thành một plugin chuyển đổi một thẻ chọn hiện có, mặc dù tôi chưa thấy điều đó được thực hiện.

Tái bút: Vấn đề chính mà tôi thấy với "jQuery Editable Combobox" là nó vẫn là một danh sách được chọn và không rõ ràng là bạn có thể bắt đầu nhập một cái gì đó mới.



15

Một nhánh mới của dự án sexy-combo hiện đã ra mắt, có vẻ đầy hứa hẹn: http://code.google.com/p/ufd/


Tôi thích rằng nó biến một lựa chọn thành một hộp kết hợp.
Beetstra

1
Sau khi xem xét mọi đề xuất trên trang, tôi quyết định chọn đề xuất này. Nhanh chóng, đơn giản, chỉ cung cấp chức năng cơ bản mà tôi muốn và làm việc trên một đầu vào được chọn hiện có
elwyn

Cũng có thể làm việc với Jquery UI ThemeRoller
codeulike

Cái này là biz cho tôi. Hoạt động liên tục trên IE7 và IE8, đó là một yêu cầu. Tìm kiếm infix (giữa từ), thanh cuộn cho danh sách dài hơn và chơi độc đáo với các thành phần khác.
Alastair

Đây là cách dễ dàng nhất để tích hợp nếu mã hiện tại của bạn sử dụng trình đơn thả xuống html cũ. Tôi đã sử dụng cái này.
Tối đa

14

Đối với các tập dữ liệu lớn, còn JQuery UI Autocomplete , về cơ bản là phiên bản "chính thức" của plugin Autocomplete của Jorn Zaeferrer thì sao?

Tôi cũng đã viết một plugin combobox JQuery trực tiếp nhận được phản hồi khá tốt từ người dùng. Nó rõ ràng không dành cho các bộ dữ liệu lớn; Tôi nghĩ rằng nếu bạn muốn thứ gì đó có thể lược bớt danh sách dựa trên những gì người dùng nhập, bạn nên sử dụng plugin tự động hoàn thành của Jorn.


Autocomplete Plugin Jorn Zaeferrer là đơn giản và tuyệt vời
Jake Wilson


7

Điều này cũng đầy hứa hẹn:

Hộp tổ hợp thả xuống JQuery trên simpletutorials.com


Trông khá đẹp, nhưng không hỗ trợ việc có một tên và giá trị khác như bạn có thể làm với <tùy chọn> được chọn
BT

1
Cũng không hỗ trợ hai hộp kết hợp trên một trang.
Tim Saylor

7

Thành phần ComboBox / Autocomplete chính thức của jQuery UI đang được tạo ... (trước đó là phiên bản beta cho jQuery UI 1.5.x), hãy xem jQuery UI Wiki

CẬP NHẬT:

Chức năng tự động hoàn thành hiện là một tính năng cốt lõi của giao diện người dùng jQuery, hãy xem tài liệu .


Điều này hiện đang hoạt động với jQuery 1.8. Tôi đang sử dụng nó khá thành công, nó là một widget được thiết kế tốt.
Boldewyn

Có phải bạn đang trải nghiệm hiệu ứng bài viết? Khi tôi nhấp vào mũi tên để chuyển đổi danh sách, trang của tôi được đăng và tôi được làm mới trang ...
theo chiều kim đồng hồ.

7
một combobox không giống như autocomplete
Neil McGuigan

5

Nếu bạn không cần nhiều cột, thì đã chọn là một lựa chọn tốt khác. MIT được cấp phép


+1 cho đã chọn. Trông tuyệt vời và chúng tôi không phải thực hiện bất kỳ thay đổi nào đối với danh sách thả xuống hiện có với dữ liệu đến từ ObjectDatasource. Nó chỉ hoạt động!
Matt,


3

Tôi đang tìm kiếm giống nhau. Cái tôi thích nhất cho đến bây giờ là cái này cho ExtJs - ngoại trừ tôi đã không thử nghiệm nó với các Danh sách lớn: www.sencha.com/deploy/dev/examples/form/combos.html

Đây là một cái khác thực sự (!) Nhanh: http://jsearchdropdown.sourceforge.net/

Ví dụ, SexyCombo hoạt động khá tuyệt vời nhưng là cách làm chậm các danh sách dài hơn. SexyCombo dân gian UFD nhanh hơn rất nhiều, nhưng thời gian khởi tạo vẫn còn khá chậm đối với các danh sách thực sự lớn. Ngoài ra đôi khi tôi nhận được một số ít! "nhấp nháy". Nhưng tôi đoán sẽ có một số cập nhật trong tương lai gần.


ExtJs cũng hoạt động rất tốt với các danh sách lớn (hoặc khổng lồ) vì nó hỗ trợ phân trang và bạn có thể truy vấn các giá trị cục bộ hoặc quyết định gửi truy vấn trở lại máy chủ và cung cấp một lượng kết quả khác. Vấn đề với ExtJs là đường cong học tập quá dốc.
stivlo

3

Sexy-Combo không được dùng nữa. Dự án thả xuống Lọc nhanh không phô trương tồn tại sự phát triển hơn nữa. Có vẻ hứa hẹn, vì tôi có yêu cầu tương tự.

https://code.google.com/p/ufd/


Mặc dù hay nhưng có vẻ như nó không hoạt động với jquery> 1.6. Tìm kiếm các tùy chọn khác.
dan radu


2

Tại sao bạn không thử http://jqueryajax.codeplex.com/ . Nó là một tập hợp các điều khiển ASP.NET cũng chứa nhiều cột thả xuống.



2

Tôi đã gặp vấn đề tương tự, vì vậy tôi đã kết thúc việc làm của riêng mình.

Nó có một hệ thống mẫu được tích hợp sẵn, vì vậy bạn có thể làm cho kết quả giống như bất kỳ thứ gì bạn muốn. Hoạt động trên tất cả các trình duyệt chính và chấp nhận mảng & đối tượng json. http://code.google.com/p/custom-combobox/



2

Tôi đã thử http://jqueryui.com/demos/autocomplete/#combobox và các vấn đề gặp phải là:

  • Hiển thị trên nhiều trình duyệt
  • Không thể gửi giá trị tùy chỉnh

Kết quả là tôi đã chỉnh sửa nó một chút và nó hoạt động tốt đối với tôi trong ASP.NET MVC. Phiên bản CSS và tập lệnh tiện ích của tôi có thể được tìm thấy tại đây http://saplin.blogspot.com/2011/12/html-combobox-control-and-aspnet-mvc.html

Mẫu về ràng buộc mô hình MVC với giá trị tùy chỉnh cũng có ở đó.





Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.