Solved

select2 formatting changes when you set multiple = true

Posted on 2014-12-24
10
575 Views
Last Modified: 2014-12-26
Hi

If you look at this jsfiddle
 http://jsfiddle.net/pHSdP/2/

Open in new window

and set multiple = true the dropdown arrow disappears. Please can you advise how to keep the dropdown arrow

Thanks and Merry Christmas
0
Comment
Question by:andieje
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 6
  • 4
10 Comments
 
LVL 58

Expert Comment

by:Gary
ID: 40517043
Since there is nothing in the plugin to set it you will have to add your own

http://jsfiddle.net/pHSdP/782/

.select2-container-multi .select2-choices {
    background:url("/path_to/dropdown_arrow.png") no-repeat right center !important
}

Open in new window

0
 

Author Comment

by:andieje
ID: 40517851
thanks - will try to this week :)
0
 

Author Comment

by:andieje
ID: 40517859
Also if you delete a tag it goes mental too. It just gets narrower and and narrower, It doesnt have  a min widht, Sorry if i seem useless but i'm nervous about jquery,
0
Monthly Recap

May was a big month for new releases from Linux Academy! Take a look at what our team built recently in our blog. You can access the newest releases from our blog.

 

Author Comment

by:andieje
ID: 40517872
does the code you posted solve both? thanks
0
 
LVL 58

Expert Comment

by:Gary
ID: 40517875
No, but that is a different question.
0
 

Author Comment

by:andieje
ID: 40517885
As you delete items from select 2 it gets smaller and smaller until it barely visible
0
 
LVL 58

Expert Comment

by:Gary
ID: 40517887
What gets smaller
0
 

Author Comment

by:andieje
ID: 40517894
the select box. until its only about 5mm. It doesnt disappear completely

This worked for the select but not for the input type

.select2-container-multi .select2-choices {
    background:url("/path_to/dropdown_arrow.png") no-repeat right center !important
}

I had to set fixed-width
0
 
LVL 58

Accepted Solution

by:
Gary earned 500 total points
ID: 40517915
Then just set a fixed width on the input

.select2-container-multi .select2-choices {
     background:url("/path_to/dropdown_arrow.png") no-repeat right center !important;
     width:200px
 }

Open in new window


Or create a test page online I can look at because even in the fiddle above that's not happening or I am not understanding what you are talking about.
0
 

Author Comment

by:andieje
ID: 40518599
no - i set the fixed width on the input :)
0

Featured Post

Secure Your WordPress Site: 5 Essential Approaches

WordPress is the web's most popular CMS, but its dominance also makes it a target for attackers. Our eBook will show you how to:

Prevent costly exploits of core and plugin vulnerabilities
Repel automated attacks
Lock down your dashboard, secure your code, and protect your users

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

In this article you'll learn how to use Ajax calls within your CodeIgniter application. To explain this, I'll illustrate how to implement a simple contact form to allow visitors to send you an email through your web site.
Introduction Knockoutjs (Knockout) is a JavaScript framework (Model View ViewModel or MVVM framework).   The main ideology behind Knockout is to control from JavaScript how a page looks whilst creating an engaging user experience in the least …
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

707 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question