3

Tenho um modal em bootstrap:

<!-- Modal content-->
<div class="modal-content">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal">&times;</button>
    <h4 class="modal-title">Agendar reunião do evento <?php echo $row- >denominacao; ?></h4>
  </div>
  <div class="modal-body">
    <div class="box">
      <div class="box-body">
        <?php echo form_open('utilizador/alterarAgendamento'); ?>
          <div class="row">
            <div class="form-group col-xs-6">
              <label>Data</label>
              <div class="input-group">
                <div class="input-group-addon">
                  <i class="fa fa-calendar"></i>
                </div>
                <input type="hidden" value="<?php echo $row->idevento; ?>" name="idevento" />
                <input type="text" class="form-control data_inserir" readonly="readonly" name="data" />
              </div>
            </div>
            <div class="form-group col-xs-6 bootstrap-timepicker">
              <label>Hora</label>
              <div class="input-group">
                <input type="text" class="form-control timepicker" name="hora" />
                <div class="input-group-addon">
                  <i class="fa fa-clock-o"></i>
                </div>
              </div>
            </div>
          </div>
          <div class="row">
            <div class="form-group col-xs-12">
              <label>Notas</label>
              <textarea class="form-control" rows="3" name="nota" placeholder=""> </textarea>
            </div>
          </div>
          <button type="submit" class="form-control">Re-Agendar</button>
          <?php echo form_close(); ?>
      </div>
    </div>
  </div>
</div>

O input com a class data_inserir está a chamar a função dataPicker, mas esta aparece por trás do modal e não estou a conseguir fazer com que fique à frente.

inserir a descrição da imagem aqui

0

1 Resposta 1

2

Isso normalmente é um problema com o z-index, tente adicionar um valor de z-index mais alto na sua class de exibição do DatePicker como por exemplo:

.suaClassDatePicker {
    z-index: 100000;
}
6
  • já tentei, até ja alterei o código do .js com a versão que diz que está corrigida mas não funciona :/ Commented 15/03/2016 às 10:57
  • Qual datepicker voce está usando ? O do jquery-ui?
    – Brunno
    Commented 15/03/2016 às 11:09
  • olá, é este, github.com/eternicode/bootstrap-datepicker Commented 15/03/2016 às 12:42
  • 1
    @LaranjaMecânica, amigo de um olhada nesse jsfiddle, nele eu estou forçando o z-index. Se por acaso não funcionar na sua aplicação, sugiro atualizar a biblioteca para versão mais nova. teste e me de um feedback aqui :)
    – Brunno
    Commented 15/03/2016 às 12:56
  • 2
    Brunno, Obrigado, com o .datePicker não funcionou, mas alterei no css .datepicker.dropdown-menu {z-index:1000;} para .datepicker.dropdown-menu {z-index:10000;} e já funcionou obrigado Commented 15/03/2016 às 14:41

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 .