Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to change the Bootstrap multiselect dropdown position on top?

I have tried to change the Position of bootstrap multiselect dropdown menu on top but no luck. Below instead of using right how to show top of control.

<select id="example-dropRight" multiple="multiple">
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
    <option value="4">Option 4</option>
    <option value="5">Option 5</option>
    <option value="6">Option 6</option>
</select>

<script type="text/javascript">
    $(document).ready(function() {
        $('#example-dropRight').multiselect({
            buttonWidth: '400px',
            **dropRight: true**
        });
    });
</script>
like image 564
Santhose Kumar Avatar asked Jan 29 '26 16:01

Santhose Kumar


1 Answers

You can do like thi way...DEMO

<div class="btn-group dropup" style=" margin: 100px;">
  <button class="btn">Dropup</button>
  <button class="btn dropdown-toggle" data-toggle="dropdown">
    <span class="caret"></span>
  </button>
 <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu">
  <li><a tabindex="-1" href="#">Action</a></li>
  <li><a tabindex="-1" href="#">Another action</a></li>
  <li><a tabindex="-1" href="#">Something else here</a></li>
  <li class="divider"></li>
  <li><a tabindex="-1" href="#">Separated link</a></li>
</ul>
</div>
like image 99
sheshadri Avatar answered Feb 01 '26 09:02

sheshadri



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!