चुना और Select2 के बीच अंतर क्या हैं?


157

चुना और विस्तार करने के लिए चुना और Select2 दो और लोकप्रिय पुस्तकालय हैं।

दोनों को सक्रिय रूप से बनाए रखा जाता है, चुना पुराना है और jQuery और प्रोटोटाइप दोनों का समर्थन करता है।

Select2 केवल jQuery है, इसके प्रलेखन का कहना है कि Select2 Chosen से प्रेरित है, लेकिन पुनर्लेखन के लिए किए गए किसी भी सुधार (यदि कोई हो) या अन्य कारणों का विवरण नहीं करता है।

दो पुस्तकालयों में बहुत अधिक समान सुविधा सेट है, एकमात्र तुलना जो मैंने पाया है वह कुछ हद तक अनिच्छुक jsperf परीक्षण पृष्ठ है।

क्या इन पुस्तकालयों में से किसी का भी दूसरे पर कोई लाभ है?


11
पुल अनुरोधों के साथ आपका अनुभव शायद एक अच्छा संकेत है कि Select2 को फिर से लिखना क्यों शुरू किया, कांटा नहीं। मैंने यह भी देखा कि Select2 में बेहतर (या कम से कम) प्रलेखन है।
पॉल ५

1
जब यह मायने रखता है या अंतर के लिए चुना है MIT है जबकि Select2 Apache लाइसेंस प्राप्त है।
ईजीएल 2-101

2
सटीक होने के लिए, Select2 Apache लाइसेंस या GPL v2 के तहत उपलब्ध है। is licensed under the Apache License, Version 2.0 (the "Apache License") or the GNU General Public License version 2
पॉल

जवाबों:


92

Select2 3.3.1 के अनुसार, नीचे इसकी README.md में क्या दस्तावेज हैं

क्या Select2 समर्थन करता है जो चुना नहीं है?

  • बड़े डेटासेट के साथ कार्य करना: चुना को पूरे डेटासेट को optionDOM में टैग के रूप में लोड करने की आवश्यकता होती है , जो इसे छोटे-छोटे डेटासेट के साथ काम करने के लिए सीमित करता है। Select2 ऑन-द-फ्लाई परिणाम खोजने के लिए एक फ़ंक्शन का उपयोग करता है, जो इसे आंशिक रूप से परिणाम लोड करने की अनुमति देता है।
  • परिणामों की पेजिंग: चूंकि Select2 बड़े डेटासेट के साथ काम करता है और केवल एक समय में मिलान परिणाम का एक छोटा सा लोड करता है, जिससे इसे पेजिंग का समर्थन करना पड़ता है। Select2 खोज फ़ंक्शन को कॉल करेगा जब उपयोगकर्ता वर्तमान में लोड किए गए परिणाम सेट के निचले भाग पर स्क्रॉल करता है जो परिणामों के 'अनंत स्क्रॉलिंग' की अनुमति देता है।
  • परिणामों के लिए कस्टम मार्कअप: चुना केवल पाठ परिणामों का समर्थन करता है क्योंकि यह एकमात्र मार्कअप है जो समर्थित है option टैग । Select2 एक विस्तार बिंदु प्रदान करता है जिसका उपयोग परिणामों का प्रतिनिधित्व करने के लिए किसी भी प्रकार के मार्कअप का उत्पादन करने के लिए किया जा सकता है।
  • मक्खी पर परिणाम जोड़ने की क्षमता: Select2 उपयोगकर्ता द्वारा दर्ज किए गए खोज शब्द से परिणाम जोड़ने की क्षमता प्रदान करता है, जो इसे टैगिंग के लिए उपयोग करने की अनुमति देता है।

2
fwiw किसी ने चुना के लिए "फ्लाई पर परिणाम जोड़ें" सुविधा पर काम किया: github.com/shezarkhani/chosen/tree/create_new_options मैं एक्सप्रेशनइग्यूइन ऐड-ऑन एमएक्स सिलेक्ट प्लस (यह कैसे होता है में इसके किसी प्रकार के अनुकूलन का उपयोग कर रहा हूं मुझे यहाँ मिल गया क्योंकि अब Select2 का उपयोग कर एक प्रतिस्पर्धी ऐड-ऑन है)।
notacouch

यह ध्यान दिया जाना चाहिए कि जावास्क्रिप्ट को अक्षम करने के बाद सेलेक्ट 2 में एक गिरावट नहीं है, क्योंकि विकल्प AJAX के माध्यम से आबादी वाले हैं।
मृत्युभोज

10
AJAX के माध्यम से डेटा खींचने वाला कुछ भी जावास्क्रिप्ट के बिना काम नहीं करेगा। Select2 पूर्व-आबादी वाले मानों के साथ ठीक काम करता है और AJAX का उपयोग नहीं करना पड़ता है।
zachzurn

@notacouch "मैट्रिक्स सपोर्ट" और "लो वैरिएबल सपोर्ट" और "सेफक्रैकर सपोर्ट" क्या है? क्या ये अवधारणाएँ ExpressionEngine के लिए विशिष्ट हैं?
जॉन ज़ब्रोस्की

@JohnZabroski हां, वे वाणिज्यिक EE हैं 2.x ऐड-ऑन (iirc SafeCracker बनाया गया है) हो सकता है।
notacouch

40

IMHO चुना "बनाए रखा है" लेकिन नहीं "सक्रिय रूप से बनाए रखा"। 341 मुद्दों और 51 खींचो अनुरोधों के लिए चुना। Select2 में 128 मुद्दे और 25 पुल अनुरोध हैं। मुझे लगता है कि इनके लिए पैटर्न मूल रूप से है

  • जो भी एक आप से अधिक आकर्षक अपील कर रहा है
  • एक या दो एप्लिकेशन में इसका उपयोग करें
  • अनुकूलन समस्याओं या सीमाओं के खिलाफ टकराएँ
  • शायद मुद्दों और पुल अनुरोधों के माध्यम से समुदाय के साथ काम करने की कोशिश करें
  • अंततः तंग आ गए और इस प्रक्रिया में जो कुछ भी सीखा, उसका उपयोग करके अपना निर्माण करें

जो भी आप चुनते हैं, यदि आपका उपयोग मामला उनके मीठे स्थान पर होता है, तो कोई भी काम करेगा। यदि नहीं, तो आपको अंततः अपना स्वयं का लिखना होगा या भारी रूप से इन्हें अनुकूलित करना होगा। किसी भी मामले में, जिसमें से एक विशेष रूप से महत्वपूर्ण नहीं है। मुझे लगता है कि मैं @Andy Ray और @paul के साथ पक्ष रखूंगा कि Select2 शायद बेहतर प्रारंभिक विकल्प है।


4
मेरे विचार में अधिक मुद्दों का मतलब अधिक लोग देखभाल और उपयोग करते हैं। और बड़ा समुदाय बेहतर कोड का उत्पादन करता है (यह आवश्यक नहीं है कि चुने पर लागू हो)। AngularJS: 397 मुद्दे, 49 पुल reqs; हर्षित / नोड: 476 मुद्दे, 98 पुल reqs। मुझे आश्चर्य है कि फ़ायरफ़ॉक्स, लिनक्स कर्नेल या जीसीसी के लिए नंबर क्या होंगे।
पॉल

हाँ, यह सिर्फ एक अनुमान है। सिद्धांत रूप में, एक ऑटोसलेक्ट विजेट को आनंद / नोड जैसी किसी चीज़ की तुलना में परिमाण कम जटिलता के कई आदेश होने चाहिए। ये चीजें अत्यधिक प्रचलित होती हैं, इसलिए मुझे समझ में आता है कि लोग पुल अनुरोध दाखिल कर रहे हैं, जिसे अनदेखा किया जाता है, और फिर वे एक अलग कांटा या फिर से लिखना जारी रखते हैं। YMMV।
पीटर ल्योन

यदि आपकी योजनाएँ अनुकूलन दृष्टिकोण के साथ जाने की हैं तो बस एक नोट: चुना के पास कोड की एक छोटी मात्रा है (लगभग 1 / 3rd), लेकिन CoffeeScript और SASS (JS / CSS के संकलित होने से पहले) में लिखा गया है। यदि आप पहले से ही कॉफीस्क्रिप्ट से परिचित हैं, तो आपकी पसंद सरल है: चुना को समझना और अनुकूलित करना आसान होगा।
टिम डोर

@Peter Lyons ये कुछ बहुत ही विचित्र मेट्रिक्स हैं जो आपके निष्कर्ष निकालने के लिए उपयोग किए जाते हैं (ऐसा नहीं कि मैं आपके निष्कर्ष से असहमत हूं)। योगदानकर्ताओं की संख्या पर एक नज़र डालें (Select2 = 239 v। चुना = 73) लेकिन यह भी भ्रामक हो सकता है, हमेशा बेहतर नहीं होता है। प्रत्येक GitHub प्रोजेक्ट डिस्प्ले के पल्स और ग्राफ़ अन्य उपयोगी आँकड़ों के एक टन के साथ-साथ इतिहास और आवृत्ति को सूचित करते हैं कि कौन सा प्रोजेक्ट सक्रिय विकास से गुजर रहा है "बनाम" बनाए रखा जा सकता है।
cfx

FWIW, पिछले कुछ वर्षों में Chosen को बहुत सारे अपडेट मिले हैं।
चार्ल्स वुड

21

उल्लेख के लायक एक और अंतर यह है कि इसमें Chosenविकसित किया गया है Sassऔर CoffeeScriptजबकि Select2सादा CSSऔर है JS। यह मेरा व्यक्तिगत विकल्प है कि Sassऔर CoffeeScriptजटिलता की अनावश्यक परतें हैं जो डिबगिंग को कठिन बनाती हैं।

दोनों की कोशिश करने के बाद मैंने न तो उपयोग करने का फैसला किया है - Select2आइटम की कार्यक्षमता बनाने की कोशिश करने के लिए एक बहुत ही बालों वाला मामला बन जाता है जैसा कि आप बस <select>तत्वों के साथ संलग्न होने पर नहीं कर सकते - यह सिर्फ हुप्स के बारे में अच्छी तरह से सोचा नहीं था। कूदना।

मैं selectize.js का उपयोग करने पर बस गया हूं जो कि नए <option>...</option>तत्व को फॉर्म के DOM में जोड़ता है - और यह समझदार है। यह भी उपयोग करता है LESS- लेकिन मैं इसे और बस दर्जी को CSSसीधे आपकी परियोजना में संकलित करूंगा ।


2
selectize.jsकम उपयोग करता है । क्या यह एक तकनीकी मृत अंत की तुलना Sassमें कम है?
क्रिस वेसलिंग

नहींं, यह एक ही डोमेन में है, लेकिन तीन चयनों में से। परियोजना को फिट करने के लिए कम से कम ट्विकिंग की आवश्यकता थी।
डैनियल सोकोलोव्स्की

Selectize में फ़ायरफ़ॉक्स 28 पर दृश्य मुद्दे हैं।
MEM

@ MEM आप अधिक विशिष्ट हो सकते हैं।
डैनियल सोकोलोव्स्की

फ़ायरफ़ॉक्स 28 (मैक ओएस एक्स) में, आप प्रत्येक इनपुट फ़ील्ड के नीचे एक अतिरिक्त ग्रे "मार्जिन या पैडिंग या बॉर्डर" देखेंगे। यह एक प्रभाव नहीं है जो मुझे लगता है। यह एक दृश्य असंगति होना चाहिए। यह स्पष्ट है कि एक बार हम उन्हें एफएफ पर देखते हैं, और उदाहरण के लिए क्रोम पर समान गड़बड़ नहीं होती है।
MEM

18

select.js बनाम select2.js

  • दोनों के लिए एमआईटी लाइसेंस
  • निर्भरता:
    • Select2: jQuery
    • चुना: tbc
  • डेस्कटॉप ब्राउज़र समर्थन:
    • Select2: IE8 +
    • चुना: IE8 +
  • डिवाइस का समर्थन:
    • Select2: अस्पष्ट
    • चुना: iPhone, iPod टच और Android मोबाइल उपकरणों पर अक्षम
  • वजन (छोटा):
    • Select2: 57KB
    • चुना: 27KB
  • उपयोग: Select2 अधिक "फैंसी" UI का समर्थन करता है ('टेम्प्लेट' देखें)
  • दोनों कोड रिपोज गितुब पर उपलब्ध हैं
    • Select2: योगदान: बहुत सक्रिय
    • चुना: योगदान: Select2 से लगभग 3x कम

select2.js योगदान चुना गया है

ps। जब मैं लापता बिंदुओं के बारे में अधिक पता लगाता हूं तो मैं इस उत्तर को अपडेट करने की कोशिश करूंगा


Select2 को अन्य की तरह ही मोबाइल उपकरणों का समर्थन करना चाहिए । हम यह सुनिश्चित करने की कोशिश करते हैं कि यह सभी उपकरणों पर सभी इच्छित कार्यक्षमता के साथ ही काम करे।
केविन ब्राउन

1
मुझे लगता है कि मुख्य कारण select2 अधिक सक्रिय है कि वे select2 4.x पर काम कर रहे हैं, जो कि एक प्रमुख री-राइट है। मैं ईमानदारी से नहीं समझता कि लोग योगदान पर इतना जोर क्यों देते हैं। काश GitHub में एक संचयी प्रवाह आरेख होता जो कोड कवरेज और परीक्षण मामलों जैसी महत्वपूर्ण चीजों को ट्रैक करता, साथ ही मुद्दों के लिए प्रतिक्रिया समय भी! (मैं select2, btw का उपयोग करता हूं, मेरी बात सिर्फ एक सामान्य पालतू जानवर है जो योगदान पर ध्यान केंद्रित करने और ऊपर दिए गए चार्ट द्वारा प्रोत्साहित की जाने वाली सामाजिक इंजीनियरिंग के बारे में है।)
जॉन ज़ब्रोस्की

13

सबसे पहले, मैं आपको बताता हूं कि चुना और Select2 दो महान प्लगइन हैं और यह चुना के बारे में मेरा व्यक्तिगत अनुभव है। जो वे कह रहे हैं वह सब चुना के बारे में सच है।

मुद्दा साथ Peteris Caune द्वारा बताया select2 वर्ष की है और अभी भी कोई आधिकारिक ठीक है। एपीआई के लिए बस कोई अच्छा दस्तावेज नहीं है। यह बताया गया है (कई बार मुद्दा 671 देखें) लेकिन अभी भी कुछ नहीं है। इस मुद्दे को हल करने में उन्हें लगभग 2 साल लग गए, जहां चुने गए मूल रूप से काम नहीं करेंगे यदि आप overflow:hiddenइसे दिखाने से पहले डिव को छिपाते हैं (और आपको एक witdh:X%विकल्प का उपयोग करना होगा जिसे आप मूल रूप से कभी नहीं जान पाएंगे यदि आप इस मुद्दे की तलाश नहीं करते हैं)।

मैं कहता हूँ कि मुख्य समस्या ठीक गति है जैसे कि समस्या 92 में DelvarWorld ने कहा:

मेरा पुल अनुरोध इस समस्या को हल करता है, लेकिन मेरे अन्य लोगों की तरह और चुने गए लोगों में से कई को अनदेखा किया जा रहा है। कोड आधार के बहुत छोटे होने के साथ इस परियोजना में बहुत अधिक योगदान है।

मैंने पहली बार अपने MIT लाइसेंस के लिए चुना था, लेकिन मेरे पास सभी थ्रेस इश्यू थे (ड्रॉपडाउन कट, एपीआई नहीं ढूंढ रहा था, ओवरफ्लो छिपे होने के घंटों की तलाश में था), इसलिए मैंने select2 पर स्विच करने का फैसला किया क्योंकि इसका एक बेहतर दस्तावेज है, कोई ड्रॉपडाउन बग नहीं और तेजी से ठीक करता है।


बस ध्यान दें Select2 भी MIT के तहत लाइसेंस प्राप्त है। github.com/select2/select2/blob/master/LICENSE.md
at 9

यह उत्तर वास्तव में पुराना है और अब लागू नहीं हो सकता है। समय मिलने पर मैं इसे संपादित करूंगा।
zipp

9

एक सुविधा जो Select2 में काम करती है, लेकिन चुना में काम नहीं करती है, वह selectतत्व है जो overflow: hiddenया है overflow: auto

यहां छवि विवरण दर्ज करें

चुना मुद्दे के लिए चुना: https://github.com/harvesthq/chosen/issues/86


मैं उसी मुद्दे को चुना के साथ सामना कर रहा हूं।
devXen

1
आप इसे .chosen-drop { z-index: 999999 !important;}ठीक करने के लिए कर सकते हैं
अल्रीज़ा फ़ाताही

6

कुछ अंतर जो मुझे इन दो प्लगइन्स के साथ काम करते हुए मिले हैं:

  • Select2 के साथ आप विकल्प में किसी भी स्थान पर खोज कर सकते हैं। उदाहरण के लिए, यदि आपके पास ABCDEFG नामक एक विकल्प है और आप CDE में टाइप करते हैं, तो आपको खोज परिणामों में वह विकल्प मिलेगा, लेकिन चुने हुए के साथ आपको परिणाम प्राप्त करने के लिए AB .. और इसी प्रकार लिखना होगा।

  • मैंने पाया है कि बड़े डेटासेट के साथ, चुने हुए सेलेक्ट 2 की तुलना में तेजी से लगता है, विशेष रूप से IE में।


2
हाँ चॉसेन शब्दों पर खोज करता है, जो Kingdomउनके उदाहरण पृष्ठ पर टाइप कर रहा है, जो कि उसे करने का United Kingdomएक बहुत ही तार्किक तरीका लगता है, आप इसे भी निर्दिष्ट कर सकते हैं $("#element").chosen({ search_contains: true });
डैनियल सोकोलोव्स्की

2
मैं आपसे सहमत हूं और अक्सर ऐसा ही होता है। आप शब्दों की तलाश में होंगे। लेकिन कई उदाहरणों में जहां आपके पास 'xyz (abc)' जैसे कोष्ठक में चीजें हैं यदि आप 'abc' टाइप करते हैं तो आप 'xyz' की भी तलाश कर रहे हैं जिसे वापस नहीं किया जाएगा। मुझे लगता है, यह आपके द्वारा उपयोग किए जा रहे परिदृश्य पर उबलता है। मेरे वेब ऐप में मैंने इन दोनों का उपयोग किया है जहां वे प्रासंगिक थे। मुझे आईई में बेहतर रेंडरिंग स्पीड के कारण केवल थोड़ा अधिक चुना गया है।
रेगेमाहन

5

Select2 मोबाइल का समर्थन करता है, जबकि चुना विशेष रूप से iPods, iPhones और मोबाइल Android पर खुद को अक्षम करता है । यदि आप मोबाइल पर "विस्तारित" चुनिंदा बक्से का उपयोग करना चाहते हैं, तो यह आपकी पसंद को आसान बनाता है।


उसके लिए @RezaRahmati thx। क्या आपने किसी भी मौके पर iPhone पर कोशिश की? फसलहक.गिथुब.यो/chosen/#faqs का कहना है कि "चुना iPhone, आइपॉड टच और एंड्रॉइड मोबाइल उपकरणों पर अक्षम है"। github.com/harvesthq/chosen/pull/1388
एड्रियन बन

@adrienbe हाँ मैंने इसे सैमसंग गैलेक्सी टैब और आईपैड
रेज़ा

@RezaRahmati नतीजा क्या था?
बी २ '

@ AdrienBe यह काम करता है, मैंने इसका इस्तेमाल Medicfa.com/Users/Create?reloadList=false में किया है इसे टैबलेट से खोलें और परिणाम देखें
रेजा

5

Select2 के साथ मेरा अनुभव डेस्कटॉप पर बहुत अच्छा था, लेकिन स्पर्श मोबाइल उपकरणों पर बहुत भिन्नता थी, हमेशा कुछ क्वर्की मौजूद होते हैं। उदाहरण के लिए, ics और स्टॉक ब्राउज़र ड्रॉपडाउन के साथ एक्सपीरिया st15i पर हमेशा कीबोर्ड चोरी फोकस के कारण खुद को बंद कर रहा था। केवल इसे फिर से खोलने का एक ही तरीका है कि दर्जनों बार मेनू को स्पर्श करें, एक दूसरे और अन्य जादू जादू के लिए उंगली पकड़ें। या ड्रॉपडाउन सूची बंद होने पर टाइप करना शुरू करने के लिए, और कितने उपयोगकर्ता इसका पता लगाएंगे?

Selectize.js Select2 की तुलना में बहुत स्मूथ लगता है, लेकिन यह भी उदाहरण के लिए मोबाइल पर अपने स्वयं के मुद्दे हैं जब मूल्य का चयन किया जाता है या इनपुट किया जाता है तो यह पृष्ठ को किसी भी कारण से बाईं ओर ले जाता है। इसके अलावा, पुराने एंड्रॉइड 2.x उपकरणों पर जो अतिप्रवाह का समर्थन नहीं करते हैं, कुछ शीर्ष विकल्पों का चयन करना असंभव है, क्योंकि कीबोर्ड पॉप-अप नहीं करता है। :(

अभी भी चुना का परीक्षण करना है और मोबाइल उपकरणों के लिए अक्षम होने के बाद ऐसा बुरा विचार नहीं हो सकता है, लेकिन अंत में अच्छी पुरानी ड्रॉपडाउन हमेशा और हर जगह काम करती है।

अपडेट: अब मैंने चुना को भी टेस्ट किया है, और यह एक क्षेत्र में बेहतर है: यह डिफ़ॉल्ट रूप से (महान!) मोबाइल पर काम नहीं करता है, लेकिन इसमें शब्दों के मुद्दों को फ़िल्टर करना है। उदाहरण के लिए, शब्दों के बीच में खोज नहीं करता है, और यदि आप aligments के लिए & nbsp; का उपयोग करते हैं , तो यह पूर्ण विकल्पों को भी अनदेखा करेगा। वापस ड्राइंग बोर्ड पर।


चुना में ठीक से खोज को सक्षम करने के search_contains: trueलिए अपने विकल्पों में जोड़ें । फसल काटकर
सिसिली

1

मैंने चुना को चुना क्यों चुना

मुख्य विशेषता चयन 2 में यह है कि कोई अन्य नियंत्रण ऑटो-जादुई नहीं है, नियंत्रण के दाहिने हाथ में 'x' के साथ "सभी साफ़ करें" चयन है। यह मेरे आवेदन के लिए एक हत्यारा सुविधा है। मुझे नहीं पता कि अन्य चुनिंदा टैग एन्हांसमेंट लाइब्रेरी में इस सुविधा का अभाव क्यों है।


0

Select2 AJAX चुना नहीं करता है

चुने हुए आकार की तुलना में चयनित 2 आकार में थोड़ा भारी है।

मैंने Select2 पर स्विच किया क्योंकि ajax संचालन के लिए कोई आधिकारिक समर्थन नहीं है।

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.