Angular Datepicker - Prev and Next

Asked

Viewed 226 times

1

I am using the following calendar in my project:

https://angular-ui.github.io/bootstrap/#/datepicker

I need to customize the back and forward calendar buttons, I disabled these default calendar buttons (searched the class and gave a None display), but need to use them elsewhere in the project, does anyone have any function I can use through any div? For example:

 $('.voltar_calendario').click(function() {
            $('.datepicker').pickadate('prev');
        });
        $('.avancar_calendario').click(function() {
            $('.datepicker').pickadate('next');
        });

Note: this does not work, is an example;

I need the current date that is displayed at the top of the calendar as well.

The only html to activate the calendar is as follows:

<uib-datepicker ng-model="dt" class="well-sm no_right" datepicker-options="inlineOptions" style="float:left; width: 100%;"></uib-datepicker>

Here’s a screenshot of why I needed to hide the calendar header with css, because I need to use it in the title: inserir a descrição da imagem aqui

Same calendar link in plunker: http://plnkr.co/edit/ZrfDlSROZxKrOAiA0PXp?p=preview

  • Why you need to disable Prev and next?

  • I inserted image, deactivated with CSS the top of the calendar and now I need to use the Prev and next at the top right.

  • Did you download the Picker date template? Otherwise, it’s available on Github

  • Can you make a jsFiddle with your example and put the new buttons where you want them to be? so we can help activate them.

2 answers

1

You can via jQuery force a click on the next and Prev buttons that are inside the controller.

$('#mydt-uib-left').click(function() {
	$('div[ng-controller="DatepickerCtrl"] .uib-left').click();
});

$('#mydt-uib-right').click(function() {
	$('div[ng-controller="DatepickerCtrl"] .uib-right').click();
});
<button type="button" id="mydt-uib-left"> <- </button>
<button type="button" id="mydt-uib-right"> -> </button>

1

Try using the jquery click event without indicating ng-controller or div.

Ex:

$('.uib-left'). click();

Browser other questions tagged

You are not signed in. Login or sign up in order to post.