Remove options from input field of datetime-local type

1

I have an input field of type datetime-local and I need it to be as clean as possible, with no cleanup or step buttons and just displaying the date and time in that format: '12 / 12/2016 12:01 ', I would like to know how I can configure this field.

My code:

<input id="prevSolucao" data-bind="value: prevSolucao, enable: !semPrevisao()" placeholder="Previsão de solução" type="datetime-local" class="form-control" style="padding-left: 13px;" autocomplete="off">

Result:

I would like to remove the side buttons and that the calendar was not displayed.

    
asked by anonymous 29.12.2016 / 18:09

1 answer

1

With CSS - In Chrome

You can put the entire typing field ( ::-webkit-datetime-edit ), such as 100%, which hides the button:

input::-webkit-datetime-edit{
  min-width: 100%;
  width: 100%;
}
<input type="datetime-local">

Using a mask

Use a mask. In your case, since you do not need the functions in this field, use% s of% s. In the example I use input[text]

$('#date-field').mask("00/00/0000 00:00", {placeholder: "__/__/____ 00:00"});
input{
  margin: 10px;
  padding: 5px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><scriptsrc="http://igorescobar.github.io/jQuery-Mask-Plugin/js/jquery.mask.min.js"></script>
<label for="date-field">Datetime - local</label>
<br>
<input type="text" id="date-field">
    
29.12.2016 / 18:23