Search code examples
jqueryuser-interfacedatepickerright-to-left

jQuery ui datepicker in direction rtl page - position issue

I am working on an Arabic (rtl direction) form with a ui calendar for selecting dob. using jquery.ui.datepicker.js

There is no left or right style coming from script to position the calendar near the input location. top value is correct.

Now the calendar is positioned to the right of the page.

enter image description here

It works fine in the ltr version.

Do I need any additional fixes for rtl page?

Solution

  • From this link you can try it as below:

    DEMO

    Initialize the datepicker with the isRTL option specified:

    $( ".selector" ).datepicker({
  isRTL: true
});

    Get or set the isRTL option, after initialization:

    // Getter
var isRTL = $( ".selector" ).datepicker( "option", "isRTL" );

// Setter
$( ".selector" ).datepicker( "option", "isRTL", true );