1

I'm developing an asp.net mvc application, in which I'm trying to get a Date value using a datepicker, I've been struggling a lot to find an appropriate solution but no success, what I want it to accept: dd/mm/yyyy but after picking the date, the datepicker take always this format: mm/dd/yyyy

Screenshot

enter image description here

The problem that the ModelState will be not valid the day's value is bigger als 12 (debugger read that as month).

View Code :

 <input id="datepicker" name="Date" type="text" value="dd/mm/yyyy" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'dd/mm/yyyy';}" required="">
<script>
    $(function ()
    {
        $("#datepicker").datepicker({ minDate: 0 });
    });
</script>

Model code :

    [Required]
    public DateTime Date { get; set; }
Exact
  • 269
  • 6
  • 18
  • Change your server culture to one that accepts date in `dd/MM/yyyy` format if that is what you expect the users to post the format in –  Oct 13 '17 at 09:48
  • Alternatively create a custom ModelBinder for dates –  Oct 13 '17 at 09:49
  • I tried that with adding globalization in web config but it didn't work, The ModelBinder I didn't try it coz I have no idea about but I will look if it work – Exact Oct 13 '17 at 09:54
  • Similar issues: https://stackoverflow.com/questions/22559112/asp-net-mvc-jquery-ui-datepicker-date-format & https://stackoverflow.com/questions/31209040/how-to-use-jquery-ui-datepicker-and-mvc-4-with-custom-format-dd-mm-yyyy. You can set `globalization culture="[culture with dd/MM/yyyy format]"` too. – Tetsuya Yamamoto Oct 13 '17 at 09:54
  • Then you did not try it correctly! –  Oct 13 '17 at 09:55
  • @StephenMuecke When you tell using model binder, you must be refer to this post: https://stackoverflow.com/questions/26813345/wrong-dateformat-with-jquery-datepicker. I think OP can register custom model binder if he gives attempt to do it. – Tetsuya Yamamoto Oct 13 '17 at 10:02
  • @TetsuyaYamamoto thanks for your answers, I will try it again despite I ve seen before and they didn't work for me, I want to ask if the creating of Modelbinder is necessary – Exact Oct 13 '17 at 10:10

5 Answers5

2

datepicker provide option to give date format.

$('#datepicker').datepicker({ format: 'dd/mm/yyyy' });

If required then try to change current culture from Global.asax file

protected void Application_BeginRequest(Object sender, EventArgs e)
{    
  CultureInfo newCulture = (CultureInfo) System.Threading.Thread.CurrentThread.CurrentCulture.Clone();
  newCulture.DateTimeFormat.ShortDatePattern = "dd/MMM/yyyy";
  newCulture.DateTimeFormat.DateSeparator = "/";
  Thread.CurrentThread.CurrentCulture = newCulture;
}
Amit Kumar
  • 5,888
  • 11
  • 47
  • 85
0

You can customize dateFormat for jquery UI datepicker.

 $("#datepicker").datepicker({ minDate: 0, dateFormat: 'dd/mm/yy' });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.3/jquery-ui.js"></script>
<input type="text" id="datepicker"/>

Change your datepicker line to this.

 $("#datepicker").datepicker({ minDate: 0, dateFormat: 'dd/mm/yy' });
Amit Kumar Singh
  • 4,393
  • 2
  • 9
  • 22
0

You can add simple option format : 

$("#datepicker").datepicker({ minDate: 0, format:"dd/mm/yyyy"});
GGO
  • 2,678
  • 4
  • 20
  • 42
0

You can sample use

$('#datepicker').datepicker({ dateFormat: 'dd/mm/yyyy' });
Hoàng Nguyễn
  • 75
  • 1
  • 12
-1
 $('#datepicker').datepicker({ dateFormat: 'dd/mm/yy' })

Instead if you want to read the value :

var date = $('#datepicker').datepicker({ dateFormat: 'dd/mm/yy' }).val();

Good luck!

marco pleimes
  • 1
  • 2