Open Closed

Change Date Picker default format #3788


User avatar
0
manuel42 created
  • ABP Framework version: v5.3.4
  • UI type: MVC
  • DB provider: EF Core
  • Tiered (MVC) or Identity Server Separated (Angular): no
  • Exception message and stack trace:
  • Steps to reproduce the issue:" Use abp-input tag with a datetime property in a modal and then change the language

Hello, I have a issue with one of the helper tags. I used the following tag in a modal:

<abp-input asp-for="Project.StartDate" type="date"/>

If I change the application language the date format of the date picker does not change. The format always have the same date format as the OS. I have tried to change it with the asp-format in the tag and the DisplayFormat annotation on the property.

Is there any other way to change the date format or need I to use a classic input tag with a jquery datepicker ?


9 Answer(s)
  • User Avatar
    0
    maliming created
    Support Team Fullstack Developer

    hi

    I have tried to change it with the asp-format in the tag and the DisplayFormat annotation on the property.

    Will it work?

  • User Avatar
    0
    manuel42 created

    Hi, no. Only the OS date format are always applied.

  • User Avatar
    0
    maliming created
    Support Team Fullstack Developer

    The date format changed after the language changed.

  • User Avatar
    0
    manuel42 created

    Yes it should but the datepicker does not change the format when I change the language. Some possibility to set a specific dateformat for the datepicker?

  • User Avatar
    0
    maliming created
    Support Team Fullstack Developer

    hi

    I can't reproduce your problem,Can you share full steps?

  • User Avatar
    0
    manuel42 created

    1 Download a Module template (For this I have used the latest version (6.0.0)) 2 Add the following in the index.cshtml.cs

        [BindProperty]
        public DateTime StartDate { get; set; }
        
        public void OnGet()
        {
            StartDate = DateTime.Now;
        }
    

    3 Add the following to the index.cshtml <abp-input asp-for="@Model.StartDate" type="date"/>

    4 Add this to XXXWebUnifedModule.cs

      Configure<AbpLocalizationOptions>(options =>
      {
        // Add the following line to existing AbpLocalizationOptions      
        options.Languages.Add(new LanguageInfo("de-DE", "de-DE", "Deutsch", "de"));
      });
    

    6 Change the language from english to german and then change the date

    Then then format does change back to the english format

  • User Avatar
    0
    maliming created
    Support Team Fullstack Developer

    Thanks. Checking.

  • User Avatar
    0
    maliming created
    Support Team Fullstack Developer

    HI

    <abp-input asp-for="@Model.StartDate" data-date-format="@CultureInfo.CurrentUICulture.DateTimeFormat.ShortDatePattern" type="date"/>

    https://bootstrap-datepicker.readthedocs.io/en/latest/

  • User Avatar
    0
    manuel42 created

    hi maliming,

    I tried your example and all the examples of bootstrap docs but nothing works. It seems that the format is impossible to change.

    https://developer.mozilla.org/en-US/docs/Web/HTML/Date_and_time_formats#date_strings

    I will close the question because the issue is not related to ABP.

Boost Your Development
ABP Live Training
Packages
See Trainings
Mastering ABP Framework Book
The Official Guide
Mastering
ABP Framework
Learn More
Mastering ABP Framework Book
Made with ❤️ on ABP v9.3.0-preview. Updated on May 21, 2025, 07:50