1. Feedback
  2. Blazor
  3. 13299

Welcome to the Blazor feedback portal. We’re happy you’re here! If you have feedback on how to improve the Blazor, we’d love to hear it!

  • Check out the features or bugs others have reported and vote on your favorites. Feedback will be prioritized based on popularity.
  • If you have feedback that’s not listed yet, submit your own.

Thanks for joining our community and helping improve Syncfusion products!

1
Vote

SfDateRangePicker no longer works after changing locale

  • Culture is loaded & set on index page using:

[Inject] protected IJSRuntime JsRuntime { get; set; }


protected override async Task OnInitializedAsync()

{

    await base.OnInitializedAsync();


    
JsRuntime.Sf()

    
    
.LoadLocaleData("wwwroot/en-US.json") //if this is not loaded, an error occurs on startup about a missing 'en-US' key

    
    
.LoadLocaleData("wwwroot/nl.json")

    
    
.LoadCldrData(

    
    
    
"wwwroot/cldr-data/main/nl/numbers.json",

    
    
    
"wwwroot/cldr-data/main/nl/timeZoneNames.json",

    
    
    
"wwwroot/cldr-data/main/nl/ca-gregorian.json",

    
    
    
"wwwroot/cldr-data/main/nl/currencies.json",

    
    
    
"wwwroot/cldr-data/supplemental/numberingSystems.json")

    
    
.SetCulture("nl")

    
    
.SetCurrencyCode("EUR");

}


protected override void OnAfterRender(bool firstRender)

{

    
JsRuntime.Sf().SetCulture("nl"); //if it is not set again here, the DateRangePicker remains in english regardless of what is set in 
OnInitializedAsync

    
base.OnAfterRender(firstRender);

}

  • DateRangePicker is put in page:

<SfDateRangePicker @bind-StartDate=Model.DateFrom

    
    
    
    
    
    
    
    
@bind-EndDate=Model.DateTo 
/>


The result:

  • the DateRangePicker uses a different format for the dates ('d-M-yyyy' instead of 'dd-MM-yyyy'), but the button on the right side to open the graphical date picker no longer works
  • two javascript errors in chrome's developer console:
    at page load:
    "
    Uncaught TypeError: Cannot read property 'setLocale' of undefined

        at s.onPropertyChanged (inputs-ec5227.min.js:1)

        at s.e.dataBind (syncfusion-blazor.min.js:1)

        at s.r.dataBind (syncfusion-blazor.min.js:1)

        at a (syncfusion-blazor.min.js:1)

    "
    the final location is line 9250 in the prettified 
    inputs-ec5227.min.js file:
    9250: 
    "this.l10n.setLocale(this.locale)," (
    this.l10n is undefined
    )

    & when clicking the button on the DateRangePicker
    "
    Uncaught TypeError: Cannot convert undefined or null to object

        at Function.keys ()

        at t.getCultureValues (calendars-ec5227.min.js:1)

        at t.createContentHeader (calendars-ec5227.min.js:1)

        at t.createContent (calendars-ec5227.min.js:1)

        at t.renderCalendar (calendars-ec5227.min.js:1)

        at t.createCalendar (calendars-ec5227.min.js:1)

        at t.createControl (calendars-ec5227.min.js:1)

        at t.renderControl (calendars-ec5227.min.js:1)

        at t.createPopup (calendars-ec5227.min.js:1)

        at t.show (calendars-ec5227.min.js:1)

    "
    this error occurs at line 221 of the prettified
    calendars-ec5227.min.js
    file:
    220: 
    "e = "en" === this.locale || "en-US" === this.locale ? sf.base.getValue(s, sf.base.getDefaultDateObject()) : this.getCultureObjects(sf.base.cldrData, "" + this.locale);"
    221:  "
    for (var i = 0, a = Object.keys(e); i < a.length; i++){..." (e is null or undefined)