alfinete
Power Member
bibliotecas jquery
bootstrap
bootstrap datetimepicker
https://eonasdan.github.io/bootstrap-datetimepicker/
tenho um calendário bootrap datetimepicker
a minha qestão é que quando abro o calendário ele abre sempre dentro da div mostrando a scroll.. ate aqui um comportamento correcto.
mas o que eu quero é que o popup do calendário abra fora da div , e o tamanho da div onde esta o conteudo do calendario se mantenha do mesmo tamanho sem activar o scrool.
A scroll sempre vai abrir mas para outros campos que não estão neste html, Agora eu quero é tratar do assunto do calendário ..
agradecia uma ajuda
obrigado
-----------
code html bootstrap
code JS de funcionamrnto do calendario
bootstrap
bootstrap datetimepicker
https://eonasdan.github.io/bootstrap-datetimepicker/
tenho um calendário bootrap datetimepicker
a minha qestão é que quando abro o calendário ele abre sempre dentro da div mostrando a scroll.. ate aqui um comportamento correcto.
mas o que eu quero é que o popup do calendário abra fora da div , e o tamanho da div onde esta o conteudo do calendario se mantenha do mesmo tamanho sem activar o scrool.
A scroll sempre vai abrir mas para outros campos que não estão neste html, Agora eu quero é tratar do assunto do calendário ..
agradecia uma ajuda
obrigado
-----------
code html bootstrap
Código:
<div class="section">
<div class="container">
<div class="row">
<div class="col-md-12">
<h3>
<i class="fa fa-fw fa-th-list"></i>Lista de Processos</h3>
</div>
</div>
<div class="row">
<div class="panel-group">
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title fontoriginal">
<a data-toggle="collapse" href="#collapse1" style="font-size: 14px;">Pesquisa Avançada</a>
</h4>
</div>
<div id="collapse1" class="panel-collapse collapse">
<div class="panel-body table-responsive" style="width: 100% !important; overflow: auto !important; height: 150px !important;" runat="server" id="DvPesquisa">
<div class="row">
<div class="col-md-4">
<div class="form-group">
<label class="control-label" for="TxtDataCriacaode">Data Criação de</label>
<div class="input-group date" id="DvDataCriacaode">
<input class="form-control" id="TxtDataCriacaode" name="TxtDataCriacaode" type="text" runat="server" enableviewstate="true" />
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar" />
</span>
</div>
</div>
</div>
</div>
</div>
<div class="panel-footer">
<div class="row">
<div class="col-md-10">
</div>
<div class="col-md-1">
<button type="button" class="btn btn-sm btn-primary pull-right" title="Apagar Dados de Pesquisa" id="BtnLimpaPesquisa" runat="server"><i class="fa fa-fw fa-md fa-trash-o text-muted" style="color: white"></i> limpar</button>
</div>
<div class="col-md-1">
<button type="button" class="btn btn-sm btn-primary pull-right" title="Procurar" validationgroup="PesquisaProcessos" id="BtnPesquisaAvancada" runat="server" onserverclick="BtnPesquisaAvancada_ServerClick"><i class="fa fa-fw fa-md fa-search text-muted" style="color: white"></i> Procurar</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
code JS de funcionamrnto do calendario
Código:
$(function () {
$('#DvDataCriacaode').datetimepicker({
locale: 'pt', format: 'DD/MM/YYYY HH:mm:ss',
widgetPositioning: {
horizontal: 'auto',
vertical: 'bottom'
},
});
});