I have used Multiselect of Bootstrap.
My issue is when I select item from options. If name is too long then button width is also increased.
How do I handle Button width after selecting options.
Try using below code.
You can set max-width as you want in css.
Javascript:
$('#yourXYZID').multiselect({
buttonText: function(options)
{
var retStr = "";
if (options.length === 0) {
retStr = "None selected";
} else if(options.length <=3){
var textArray = [];
$.each(options,function(key,value){
textArray.push($.trim($(value).html()));
});
retStr = "<div class='pull-left restricted'>"+textArray.join(",")+"</div>";
} else {
retStr = options.length+" selected";
}
return retStr+" <b class='caret'></b>";
}
});
CSS:
.multiselect.dropdown-toggle.btn.btn-default > div.restricted {
margin-right: 5px;
max-width: 100px;
overflow: hidden;
}