Calendário não aparece em formulário pai x filho

Bom dia pessoal, preciso de um auxílio de vocês.

Estamos desenvolvendo um formulário pai x filho onde o primeiro campo será preenchido com uma data, porém ao clicar no "botão" para selecionar a data, o calendário não está aparecendo. O problema ocorre em todos os navegadores.

form.png

Segue script e html do campo:



FLUIGC.calendar('#MY_SELECTOR', {
                pickDate: true,
                pickTime: false
            });


<td width="200">
        <div class="input-group date" id="MY_SELECTOR">
            <input type="text" class="form-control" placeholder="Data Deslocamento" id="dataDesloc" name="dataDesloc" onclick='validaDataDeslocamento(this.id);' >
            <span class="input-group-addon">
                <span class="fluigicon fluigicon-calendar fluigicon-xs" ></span>
            </span>
        </div>
</td>

Obrigado!

Thiago

:warning: Atenção: Esta publicação foi transferida automaticamente do fórum antigo, mas os anexos não foram incluídos.

Bom dia pessoal.

Consegui contornar o problema chamando a função abaixo ao clicar no botão para escolha da data, “forçando” o carregamento do calendar.

function selecionaData (campo) { FLUIGC.calendar('#'+campo, { pickDate: true, pickTime: false }); }

Acredito que não seja a melhor alternativa, mas por enquanto nos atende.

Thiago

O processo FluigAdhoc (Listar tarefas) vem instalado por padrão em todos os fluigs. O formulário tem pai filho e dois campos de datas que usam o componente de calendário do fluig Style Guide e eles funcionam. Não quer dar uma olhada ? Depois de carregar o Style guide a implemetação do campo fica assim :


      <td>
          <input type="text" name="dtprazoativ" class="dtprazoativ dateHeight" />
      </td>

Boa tarde João.

Já estamos carregando o style guide. Inseri o campo, conforme você informou, mas o calendário continuou não aparecendo.

Dei uma olhada no FluigAdhoc, mas não consegui identificar qual é o problema.

Obrigado!

Coloque o parametro data-date="" no seu input


        <input type="text" class="form-control" name="dataDesloc" value="" data-date="" placeholder="" data-size="small" required style="width: 25%;">

Boa tarde Hilton.

Coloquei o parâmetro que você mencionou, mas o calendário ainda não apareceu.

Obrigado!

Recomendo adicionar uma classe no seu campo de data e toda vez que adicionar uma linha ao pai e filho vc executa FLUIGC.calendar('.suaClasse'); que assim ele cria o calendário no seu campo do pai e filho.

Isso acontece pois quando a tabela cria esse campo, a função que incia o calendário já foi executada. No meu caso, criei uma função que adiciona o filho na tabela e executa novamente a função.

Lembrando que no seu HTML, o campo deve conter a classe "data".

Função utilizada:


function addEvents(tablename) {
   wdkAddChild(tablename);
   FLUIGC.calendar(".data");
}

No botão do seu formulário você deve usar o evento no click. O parâmetro da função deve conter o valor do tablename. Por exemplo:


<button class="btn btn-default" onclick="addEvents('documentos')">Adicionar Linha</button>