mvc input date is changing format when I change google Chrome language

Asked

Viewed 54 times

0

I have a website made in MVC and I have a datepicker, I want the date format of Portugal (dd-mm-yyyy), it works when I have google browser Chrome in Portuguese but when I put it in Inglish (USA) it changes to mm-dd-yyyy and I do not want it.

<input id="dateRangeF2" name="dateRangeF2" type="date" value="">

html mvc date datepicker

  • Change your question in English

  • I have a website made in MVC and I have a datepicker, I want the date format of Portugal (dd-mm-yyyy), it works when I have google browser Chrome in Portuguese but when I put it in Inglish (USA) it changes to mm-dd-yyyy and I do not want it.

  • Yes, edit your edit your question for en, if not it can be closed

1 answer

0


Good morning, you can use the Moment JS to format the date and each change. Ex:

$("input").on("change", function() {
    this.setAttribute(
        "data-date",
        moment(this.value, "YYYY-MM-DD")
        .format( this.getAttribute("data-date-format") )
    )
}).trigger("change")
input {
    position: relative;
    width: 150px; height: 20px;
    color: white;
}

input:before {
    position: absolute;
    top: 3px; left: 3px;
    content: attr(data-date);
    display: inline-block;
    color: black;
}

input::-webkit-datetime-edit, input::-webkit-inner-spin-button, input::-webkit-clear-button {
    display: none;
}

input::-webkit-calendar-picker-indicator {
    position: absolute;
    top: 3px;
    right: 0;
    color: black;
    opacity: 1;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.3/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<input type="date" data-date="" data-date-format="DD-MM-YYYY" value="2019-02-20">

Browser other questions tagged html mvc date datepicker

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