1

Estou utilizando o seguinte calendário em meu projeto:

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

Necessito personalizar os botões de voltar e avançar do calendário, eu desativei estes botões do calendário padrão (procurei a classe e dei um display none), porém preciso utilizá-los em outra parte do projeto, alguém tem alguma função que eu posso utilizar através de alguma div? Por exemplo:

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

Obs: isto não funciona, é exemplo;

Necessito da data atual que é exibida no topo do calendário também.

O único html para ativar o calendário é o seguinte:

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

Segue imagem do porque que precisei ocultar com css o cabeçalho do calendário, pois preciso utilizar no título: inserir a descrição da imagem aqui

Link do mesmo calendário no plunker: http://plnkr.co/edit/ZrfDlSROZxKrOAiA0PXp?p=preview

4
  • Por que você precisa desativar a o prev e next?
    – adelmo00
    Commented 15/04/2016 às 17:38
  • Inseri imagem, desativei com CSS o topo do calendário e agora preciso utilizar o prev e next no topo à direita. Commented 15/04/2016 às 17:41
  • Você baixou o template do date picker? Caso contrário, está disponível no Github
    – adelmo00
    Commented 15/04/2016 às 17:48
  • Podes fazer um jsFiddle com o teu exemplo e colocar os botões novos onde queres que estejam? assim podemos ajudar a ativá-los.
    – Sergio
    Commented 19/04/2016 às 4:42

2 Respostas 2

1

Você pode via jQuery forçar um clique nos botões de next e prev que estão dentro do 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
+50

Tente utilizar o evento click do jquery sem indicar o ng-controller e nem a div.

Por ex:

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

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .