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.

Made with ❤️ on ABP v8.2.0-preview Updated on March 25, 2024, 15:11