Input type datetime error

Asked

Viewed 1,209 times

2

Good afternoon, I have a problem that I can not solve, I wanted to change the format of my form to "datetime", but when I test in my browser appears as if it were text.

<div class="form-group">
    <label>Data de requisicao</label>
    <input type="datetime" class="form-control" name="data" required><br>
<div class="form-group">

Aqui estão as evidencias.

php html laravel

  • Posting the code snippet makes it easier to get help.

4 answers

3

  • Neither of the two types works...

2

The tag input type="date-time" was discontinued:

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/datetime

And was replaced by the tag input type="datetime-local":

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/datetime-local

document.getElementById("datetime").defaultValue = new Date().toLocaleDateString();
<html>
<body>
 <input id="datetime" type="datetime-local">
</body>
</html>

Obs: Does not work on I.E and Firefox: Chrome OK; Opera OK;

The guy input type="date" has support in firefox from version 57.0, in Chrome since 22;

document.getElementById("datetime").value = new Date().toLocaleDateString();
<html>

<body>
  <input id="datetime" type="date">
</body>

</html>

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Input/data

Considerations: There are still many inconsistencies in these inputs the input type="datetime-local", o DOM properties defaultValue works only on firefox, Chromium does not work but DOM properties value works.

The input type="date" the DOM porperties value does not work in the firefox also does not work on Chromium.

And then, in your browser it worked?

2


By the image classes you posted I realized you’re using Boostrap. So I suggest this model of input date with a datapicker

You need this script to work because it creates a campo de data in a input text

<script src='http://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.1/js/bootstrap-datepicker.min.js'></script>
<script>
 $('.input-group.date').datepicker({format: "dd.mm.yyyy"});
</script>


<link rel="stylesheet" type="text/css" media="screen" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />
    <link rel="stylesheet" type="text/css" media="screen" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" />
    <link rel="stylesheet" type="text/css" media="screen" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" />
    

          <div class='col-md-3'>
            <div class="form-group">
                <label for="data-pagamento">Datapicker novo</label>
                <!-- Datepicker as text field -->         
                <div class="input-group date" data-date-format="dd.mm.yyyy">
                  <input  type="text" class="form-control" placeholder="dd.mm.yyyy">
                  <div class="input-group-addon" >
                    <span class="glyphicon glyphicon-th"></span>
                  </div>
                </div>
            </div>
          </div>

    
    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

    <!-- Plugin pro Datapicker novo -->
    <script src='https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.1/js/bootstrap-datepicker.min.js'></script>
    <script>
     $('.input-group.date').datepicker({format: "dd.mm.yyyy"});
    </script>

inserir a descrição da imagem aqui

  • I got @hugocsl ... was lack of putting https at the address ... !

  • 1

    @Virgilionovic Thanks young man, I did not know that the mistake was because of protocol! Tmj

0

  • 'Cause I’ve read that article before But none of the others work

  • @Humbertovieira what you really want to do.

  • I wanted some kind of calendar to appear to choose the same year and the day

  • Give a read on my answer to see by HTML have a lot of inconsistency Chrome does not accept defaultValue, only value; I suggest you use some framework;

  • Dude, use a plugin then, bootstrap datetime Picker, ja que vc ta using bootstrap in your project

Browser other questions tagged php html laravel

You are not signed in. Login or sign up in order to post.