Ir para conteúdo

POWERED BY:

Jefferson andre

Como preencher campo datetime-local no bootstrap 4

Recommended Posts

Ola,

Tenho uma variavel que vem do mysql e contem informacoes.

 

No mysql o campo esta definido como datetime

 

No bootstrap 4 esta da seguinte maneira 

		      <div class="form-group col-md-3">
			      <label for="inputCelular">Data e hora de saida</label>
				  <input type="datetime-local" name="data_saida" id="data_saida" value="<?php echo $data_saida;?>" class="form-control" aria-label="" aria-describedby="inputGroup-sizing-sm">
			    </div>

O que pode estar incorreto ?

 

Agradeco pela ajuda

Compartilhar este post


Link para o post
Compartilhar em outros sites

Jefferson, seu mysql deve ter ao menos isso aqui e pode criar um Array, para cadastrar assim no banco.

Obs: Troca no banco de dados, o formato datetime, para date.

$data_saida = date(d-m-Y H:i:s);

 

Já o formato de saída você pode fazer assim: 

echo $data->format('d-m-Y H:i:s');

 

Se estiver usando PHP procedural ua do mesmo jeito q irei postar abaixo.

				  <input type="datetime-local" name="data_saida" id="data_saida" value="<?= $data_saida; ?>" class="form-control" aria-label="" aria-describedby="inputGroup-sizing-sm">

se puder postar como esta o Banco de Dados e tbm como esta cadastrando no banco, vai ajudar a ver melhor o problema.

 

Deus abençoe.

Compartilhar este post


Link para o post
Compartilhar em outros sites
2 horas atrás, Augusto Developer disse:

Jefferson, seu mysql deve ter ao menos isso aqui e pode criar um Array, para cadastrar assim no banco.

Obs: Troca no banco de dados, o formato datetime, para date.

$data_saida = date(d-m-Y H:i:s);

 

Já o formato de saída você pode fazer assim: 

echo $data->format('d-m-Y H:i:s');

 

Se estiver usando PHP procedural ua do mesmo jeito q irei postar abaixo.


				  <input type="datetime-local" name="data_saida" id="data_saida" value="<?= $data_saida; ?>" class="form-control" aria-label="" aria-describedby="inputGroup-sizing-sm">

se puder postar como esta o Banco de Dados e tbm como esta cadastrando no banco, vai ajudar a ver melhor o problema.

 

Deus abençoe.

Obrigado pelas informacoes, o banco de dados esta datetime mas somente funciona quando um campo esta date e em  outro campo eeu salvo a hora.

 

Gostaria de colocar ambos campos data e hora em um unico local mas ainda nao deu certo.

 

Compartilhar este post


Link para o post
Compartilhar em outros sites
Em 09/01/2020 at 10:40, Jefferson andre disse:

Ola,

Tenho uma variavel que vem do mysql e contem informacoes.

 

No mysql o campo esta definido como datetime

 

No bootstrap 4 esta da seguinte maneira 


		      <div class="form-group col-md-3">
			      <label for="inputCelular">Data e hora de saida</label>
				  <input type="datetime-local" name="data_saida" id="data_saida" value="<?php echo $data_saida;?>" class="form-control" aria-label="" aria-describedby="inputGroup-sizing-sm">
			    </div>

O que pode estar incorreto ?

 

Agradeco pela ajuda

Olá boa tarde..

tente desta forma

 

<?php 
// onde esta -4 defini com a hora do seu local
$timestamp = mktime(date("H")-4, date("i"), date("s"), 0); 
?>
<div class="col-md-4">
		<div class="form-group">
<label>Time:</label>
		<input class="form-control" name="horas"   value="<?php echo $data_hora = gmdate("H:i:s", $timestamp); ?>"  readonly="readonly">
		</div>
</div>
<div class="col-md-4">
		<div class="form-group">
<label>Data:</label>
	<input class="form-control" name="data" value="<?php echo date('d-m-Y'); ?>"  readonly="readonly">
		</div>
</div>

Espero que possa ajudar

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar Agora

  • Conteúdo Similar

    • Por clovis.sardinha
      Como fazer para colocar um spinner antes de carregar os dados do bd? Eu clico no link e entra na função do controle e só vai para a página da views quando já está pronto a query. Vi uns exemplos de colocação de spinner, mas se a página ainda não apareceu como faço? Vou anexar a função que chama a página para facilitar. 
      public function inativos()  {     $session = \Config\Services::session();     $pager = \Config\Services::pager();     $usuarios=$this->usuarios->getInativos();//faz a query no bd.     $dados=[         'usuarios'=>$usuarios,         'pager'=>$this->usuarios->pager,     ];     echo view('Admin/Relatorios/listaInativos',$dados); }   
    • Por gabrielpaiva2
      Gostaria de centralizar o card 1,2 e 3 e colocar o 4 e 5 em baixo, que tipo de alteração faço 
      algo como na img         Cards Projeto (codepen.io)
      <!DOCTYPE html> <html lang="pt-BR"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.0/css/all.min.css"> <script defer src="js/jquery.js"></script> <script defer src="js/script.js"></script> <script defer src="js/script-form-list.js"></script> <!-- Bootstrap --> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous"> <link rel="stylesheet" href="./css/style.css"> <title>TITULO</title> </head> <body> <!--cabeçalho:logo,menu,login--> <header> <div class="logo"> <i><img src="" alt="Image" height="460" width="520"></i> </div> <div> <nav id='menu'> <nav class="cabeçalho-link"> <a href='item1.html'><button>Base</button></a> <a href='item1.html'><button>Sobre</button></a> <a href='item1.html'><button>Contatos</button></a> <a href='item1.html'><button>Planos</button></a> <div class="icones"> <a id='iconLogin' class="fa-sharp fa-solid fa-users-line"></a> </div> <section id='login'> campo login <a id='fecharLogin'>X</a> </section> </nav> </div> </header> <main> <section class="main-content"> <div class="container"> <h1 class="page-title text-center">Equipe<b></b></h1> <div class="row"> <div class="col-md-3 col-sm-4"> <div class="card"> <div class="card_cover"> </div> <div class="card_padding"> <div class="card_image"> <img src="https://png.pngtree.com/element_our/png_detail/20181130/web-search-vector-icon-png_253149.jpg" alt=""> </div> <div class="card_details"> <h3>NOME1</h3> <p class="text">Função</p> </div> <div class="card_social"> <a href=#!> <img src="./imagens/card/social/linkedin.png" alt="Linkedin"> </a> <a href=> <img src="./imagens/card/social/github.png" alt="Twitter"> </a> </div> </div> </div> </div> <div class="col-md-3 col-sm-4"> <div class="card"> <div class="card_cover"> </div> <div class="card_padding"> <div class="card_image"> <img src="https://png.pngtree.com/element_our/png_detail/20181130/web-search-vector-icon-png_253149.jpg" alt=""> </div> <div class="card_details"> <h3>NOME2</h3> <p class="text">Função</p> </div> <div class="card_social"> <a href=#!> <img src="./imagens/card/social/linkedin.png" alt="Linkedin"> </a> <a href=> <img src="./imagens/card/social/github.png" alt="Twitter"> </a> </div> </div> </div> </div> <div class="col-md-3 col-sm-4"> <div class="card"> <div class="card_cover"> </div> <div class="card_padding"> <div class="card_image"> <img src="https://png.pngtree.com/element_our/png_detail/20181130/web-search-vector-icon-png_253149.jpg" alt=""> </div> <div class="card_details"> <h3>NOME3</h3> <p class="text">Função</p> </div> <div class="card_social"> <a href=#!> <img src="./imagens/card/social/linkedin.png" alt="Linkedin"> </a> <a href=> <img src="./imagens/card/social/github.png" alt="Twitter"> </a> </div> </div> </div> </div> <div class="col-md-3 col-sm-4"> <div class="card"> <div class="card_cover"> </div> <div class="card_padding"> <div class="card_image"> <img src="https://png.pngtree.com/element_our/png_detail/20181130/web-search-vector-icon-png_253149.jpg" alt=""> </div> <div class="card_details"> <h3>NOME4</h3> <p class="text">Função</p> </div> <div class="card_social"> <a href=#!> <img src="./imagens/card/social/linkedin.png" alt="Linkedin"> </a> <a href=> <img src="./imagens/card/social/github.png" alt="Twitter"> </a> </div> </div> </div> </div> <div class="col-md-3 col-sm-4"> <div class="card"> <div class="card_cover"> </div> <div class="card_padding"> <div class="card_image"> <img src="https://png.pngtree.com/element_our/png_detail/20181130/web-search-vector-icon-png_253149.jpg" alt=""> </div> <div class="card_details"> <h3>NOME5</h3> <p class="text">Função</p> </div> <div class="card_social"> <a href=#!> <img src="./imagens/card/social/linkedin.png" alt="Linkedin"> </a> <a href=> <img src="./imagens/card/social/github.png" alt="Twitter"> </a> </div> </div> </div> </div> </section> </main> <div id='muleta'></div> <footer class="w-100 py-4 flex-shrink-0"> <div class="container py-4"> <div class="row gy-4 gx-5"> <div class="col-lg-4 col-md-6"> <h5 class="h1 text-white">PS</h5> <p class="small text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt.</p> <p class="small text-muted mb-0">&copy; Copyrights. All rights reserved. <a class="text-primary" href="#">Bootstrap</a></p> </div> <div class="col-lg-2 col-md-6"> <h5 class="text-white mb-3">Informações</h5> <ul class="list-unstyled text-muted"> <li><a href="#">Home</a></li> <li><a href="#">Sobre</a></li> <li><a href="#">Contato</a></li> <li><a href="#">Planos</a></li> </ul> </div> <div class="col-lg-2 col-md-6"> <h5 class="text-white mb-3">Categorias</h5> <ul class="list-unstyled text-muted"> <li><a href="#">Home</a></li> <li><a href="#">Contato</a></li> <li><a href="#">FAQ</a></li> <li><a href="#">#</a></li> </ul> </div> <div class="col-lg-4 col-md-6"> <h5 class="text-white mb-3">Newsletter</h5> <p class="small text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt.</p> <form action="#"> <div class="input-group mb-3"> <input class="form-control" type="text" placeholder="Email" aria-label="Recipient's username" aria-describedby="button-addon2"> <button class="btn btn-primary" id="button-addon2" type="button"><i class="fas fa-paper-plane"></i></button> </div> </form> </div> </div> </div> </footer> </div> </body> </html> * { padding: 0; margin: 0; } header { width: 100%; height: 120px; background-color: #010138; position: absolute; } header .logo { color: black; font-size: 1px; font-weight: bolder; } header .logo i { color: black; } header div { width: 70%; left: 0; right: 0; margin: auto; } /* este é o cabeçalho todas as configurações de posições das opções para os usuarios estão aqui*/ header .logo { color: black; font-size: 1px; font-weight: bolder; } header .logo i { color: black; } header .cabeçalho-link { padding-left: 100px; cursor: pointer; gap: 3rem; display: flex; padding-top: 20px; font-weight: 500; border-radius: 5rem; color: aliceblue; } header .cabeçalho-link a { color: rgb(255, 255, 255); font-size: 20px; border-radius: 4rem; font-size: 1.7rem; } button { background-color: #FFCC15; color: rgb(0, 0, 0); padding: 5px; width: 150px; border-radius: 15px; font-size: 15px; cursor: pointer; } /* margem e bordas modificadas, para possuir um formato mais oval, incluindo aqui também a cor preta para as letras*/ button:hover { background-color: rgb(99, 78, 0); color: #FFCC15; } /* quando o usuario passar o cursor em cima de cada opção, ele mudará de cor*/ .logo { /*para pode adicionar a logo do meu site*/ height: 100px; width: 60px; padding-top: 49px; padding-left: 720px; padding-right: 220px; display: inline-flex; justify-content: center; text-align: center; align-items: center; cursor: pointer; } .icones { height: 100px; cursor: pointer; gap: 1rem; display: flex; border-radius: 5rem; } header .icones i, header .icones a { cursor: pointer; height: 4.5rem; width: 4.5rem; text-align: center; font-size: 40px; border-radius: 50%; padding: 5rem, 1.5rem; line-height: 4.5rem; } header .icones i:hover, header .icones a:hover { transform: rotate(360deg); border-radius: 20px; transition: 0.5s all; } .sobre .row .content .icones-container .icones span { font-size: 1.5rem; color: var(black); } #iconLogin { float: right; color: white; background: #0D0A97; } #login { display: none; position: fixed; background: white; top: 70px; right: 15%; width: 100px; height: 100px; } /* CARDS */ .main-content { margin: 50px auto; margin-top: 0; padding: 80px; max-width: 1350px; background: #fff; -webkit-box-shadow: 0 20px 100px -15px rgba(0, 0, 0, 0.1); box-shadow: 0 20px 100px -15px rgba(0, 0, 0, 0.1); } .page-title { font-size: 45px; margin: 0 auto 80px auto; margin-top: 150px; } .page-title:after { content: ""; width: 110px; height: 4px; background: #F39745; display: block; margin: 15px auto 0 auto; -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); } .card { background: #fff; -webkit-box-shadow: 0 2px 30px rgba(0, 0, 0, 0.1); box-shadow: 0 2px 30px rgba(0, 0, 0, 0.1); text-align: center; margin-bottom: 30px; border-radius: 10px; } .card .card_cover { height: 130px; overflow: hidden; background-color: #27408B; } .card .card_padding { padding: 25px; position: relative; margin-top: -85px; } .card .card_image { width: 125px; height: 125px; border-radius: 125px; overflow: hidden; border: 4px solid #FFCC15; margin: 0 auto 15px auto; -webkit-box-shadow: 0 5px 30px rgba(0, 0, 0, 0.1); box-shadow: 0 5px 30px rgba(0, 0, 0, 0.1); } .card .card_image img { width: 125px; height: 125px; -o-object-fit: cover; object-fit: cover; } .card .card_details h3 { font-size: 21px; } .card .card_details p { font-size: 16px; margin-bottom: 15px; } .card .card_social { text-align: center; } .card .card_social a { display: inline-block; } .card .card_social img { width: 33px; margin: 5px 10px; } /* SLIDE CARD */ /* FOOTER */ #muleta { clear: both; } footer { background-color: #010138; } footer a { color: black; text-decoration: none; transition: all 0.3s; } .form-control { background: #212529; border-color: #545454; } .form-control:focus { background: #212529; } @media (max-width:768px) { header .cabeçalho-link { display: list-item; } header .icones { display: list-item; } header .logo { display: auto; max-width: 200px; margin: auto; } header .backgroundFoto { max-width: 200px; margin: auto; } }  

    • Por Cícero Antônio
      Olá pessoal
       
      Migrei recentemente para um novo provedor e não consigo carregar o BOOTSTRAP de forma interna. Só consigo carregar através do link externo.
       
      Assim não consigo carregar:
      <link rel="stylesheet" href="https://www.meusite.com/assets/bootstrap/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
      Assim eu consigo:
       
      <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous"> Alguém já passou por isso?
       
      O caminho interno está correto; o arquivo está onde deveria estar; em outro provedor estava funcionando normalmente. Atualmente precisei migrar o site para o provedor HostGator e agora me apresentou esse problema. 
       
      Se alguém já tiver passado por isso e tiver uma solução eu agradeço.
       
    • Por asacap1000
      Salve galera.
      Tenho uma página com vários box deste abaixo com a descrição de uma TV que temos na empresa onde mostram os status de diversos processos.
      Ainda não coloquei o link para o direcionamento porém antes da pessoa clicar eu gostaria que quando posicionasse o mouse em cima do botão aparecesse uma miniatura do site destino.
      é Possivel isso?? eu tentei o mouseover mas não carregou, 
       
                  <div class="col-lg-3 col-xs-6">
                    <div class="small-box bg-blue-gradient" style="border-radius: 05px 05px;">
                      <div class="inner">
                        <h3 align="center"><?=$qtd_veiculos?></h3>
                        <p align="center">VEÍCULOS EM TRÂNSITO</p>
                      </div>
                    </div>
                  </div>
       
    • Por leonardorafaeldev
      Boa noite pessoal estou com um problema que o icone do meu site não aparece no mobile segue uma foto do problema o meu codigo esta assim
       
      <!-- icones -->   <link href="icones/favicon.ico" rel="icon">   <link href="icones/favicon.ico" rel="shortcut icon">    <link rel="apple-touch-icon" sizes="57x57" href="icones/apple-icon-57x57.png">   <link rel="apple-touch-icon" sizes="60x60" href="icones/apple-icon-60x60.png">   <link rel="apple-touch-icon" sizes="72x72" href="icones/apple-icon-72x72.png">   <link rel="apple-touch-icon" sizes="76x76" href="icones/apple-icon-76x76.png">   <link rel="apple-touch-icon" sizes="114x114" href="icones/apple-icon-114x114.png">   <link rel="apple-touch-icon" sizes="120x120" href="icones/apple-icon-120x120.png">   <link rel="apple-touch-icon" sizes="144x144" href="icones/apple-icon-144x144.png">   <link rel="apple-touch-icon" sizes="152x152" href="icones/apple-icon-152x152.png">   <link rel="apple-touch-icon" sizes="180x180" href="icones/apple-icon-180x180.png">   <link rel="icon" type="image/png" sizes="192x192"  href="icones/android-icon-192x192.png" >   <link rel="icon" type="image/png" sizes="36x36" href="icones/android-icon-36x36.png">   <link rel="icon" type="image/png" sizes="48x48" href="icones/android-icon-48x48.png">   <link rel="icon" type="image/png" sizes="96x96" href="icones/android-icon-96x96.png">   <link rel="icon" type="image/png" sizes="144x144" href="icones/android-icon-144x144.png">   <link rel="icon" type="image/png" sizes="72x72" href="icones/android-icon-72x72.png">   <link rel="icon" type="image/png" sizes="32x32" href="icones/favicon-32x32.png">   <link rel="icon" type="image/png" sizes="96x96" href="icones/favicon-96x96.png">   <link rel="icon" type="image/png" sizes="16x16" href="icones/favicon-16x16.png">   <link rel="manifest" href="icones/manifest.json">   <meta name="msapplication-TileColor" content="#ffffff">   <meta name="msapplication-TileImage" content="icones/ms-icon-144x144.png">   <meta name="theme-color" content="#ffffff">   <meta charset="utf-8">   <meta content="width=device-width, initial-scale=1.0" name="viewport">
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.