Search code examples
angularjsangular-bootstrap

AngularJS - On selecting date from angular-bootstrap-datetimepicker url state removing from browser URL


I am using angular-bootstrap-datetimepicker.

On clicking on date picker for selection of date & time.

The current state is removing from browser URL. How to resolve this?

HTML code

<div class="dropdown">
    <a class="dropdown-toggle" id="startDate" role="button" data-toggle="dropdown" data-target="#" href="#">
        <div class="input-group">
            <input placeholder="{{'START_DATE' | translate}} *" required type="text" class="form-control" data-ng-model="startDate"><span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
        </div>
    </a>
    <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
        <datetimepicker data-on-set-time="onStartDateSet(newDate, oldDate)" date-disabled="disableViewFields" data-ng-model="startDate" data-datetimepicker-config="{ dropdownSelector: '#startDate', startView:'day', minView:'hour' }" />
    </ul>
</div>

Solution

  • If I removed href='#' from a tag, working fine. Code follows

    <div class="dropdown">
    <a class="dropdown-toggle" id="startDate" role="button" data-toggle="dropdown" data-target="#">
        <div class="input-group">
            <input placeholder="{{'START_DATE' | translate}} *" required type="text" class="form-control" data-ng-model="startDate"><span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
        </div>
    </a>
    <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
        <datetimepicker data-on-set-time="onStartDateSet(newDate, oldDate)" date-disabled="disableViewFields" data-ng-model="startDate" data-datetimepicker-config="{ dropdownSelector: '#startDate', startView:'day', minView:'hour' }" />
    </ul>