CODEWITHSUNDEEP
csstwitter-bootstrap
flolaloop
flolaloop

Reputation: 129

Bootstrap Daterangepicker move range inputs to the right

I am currently using a basic bootstrap daterangepicker. However I need the range inputs (apply and cancel buttons) to be on the right side after the calendars.

Currently, it's on the left as so:

enter image description here

Is there any way that it is already programmed for me to easily move it to the right?

UPDATE CODE
I am using the basic code that they've provided.

<div id="reg-date" class="btn">
    <i class="glyphicon glyphicon-calendar fa fa-calendar"></i>
    <span></span> 
    <b class="caret"></b>
</div>

and here is the script that i used

<script type="text/javascript">
   $(document).ready(function() {
      $('#reg-date span').html(moment().subtract(29, 'days').format('MMMM D, YYYY') + ' - ' + moment().format('MMMM D, YYYY'));
      $('#reg-date').daterangepicker({
         opens: 'right'
      });
   });
</script>

Upvotes: 2

Views: 1794

Answers (1)

pratikpawar
pratikpawar

Reputation: 2098

If you are anticipating apply and cancel buttons on right side of control irrespective of calendar icon and caret to open datepicker controls. You could use simple code like this. It gives you the same result. Apply and cancel on right side of calendar controls

<input type="text" name="daterange" value="01/01/2015 - 01/31/2015" />

<script type="text/javascript">
$(function() {
    $('input[name="daterange"]').daterangepicker();
});

Also if you would like to work out through existing code you would need to update question with CSS and update screenshot with calendar and caret icon.

Upvotes: 1

Related Questions