CODEWITHSUNDEEP
jqueryselecttwitter-bootstrap-3drop-down-menu
Prajila V P
Prajila V P

Reputation: 5337

Change comma separation in bootstrap select

I am using bootstrap select multiple dropdown for my site. Is is giving me selected text as comma separated which is the default behaviour of bootstrap selectpicker. I need to change this to new line.

enter image description here

For example instead of Mustard,Relish I need line

Mustard Relish

Is there any way to do this?

Upvotes: 2

Views: 2120

Answers (2)

User863
User863

Reputation: 20039

Using multipleSeparator

$('#selectpicker').selectpicker({
  multipleSeparator: ' '
}).on('changed.bs.select', function() {
  $(this).selectpicker('refresh');
})
.bootstrap-select .btn:not(.bs-placeholder) {
  word-spacing: 100px;
  white-space: normal!important;
  word-wrap: break-word!important;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap-select.min.css">

<!-- Latest compiled and minified JavaScript -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap-select.min.js"></script>

<select id="selectpicker" multiple>
  <option>Mustard</option>
  <option>Ketchup</option>
  <option>Relish</option>
</select>

Upvotes: 1

Nitish Dhawan
Nitish Dhawan

Reputation: 97

I did not understand your problem. It will be better if there is fiddle or something but if u want remove comma just split it by ,

var str = Mustard,Relish;
var res = str.split(",");

res will be an array of all elements now do whatever you want to do with it

https://jsfiddle.net/nitish1712/hqog6ef0/7/

Upvotes: 0

Related Questions