0

I am stuck on a strange issue, I have a jQuery datepicker inside a Bootstrap modal popup. It works fine for some browser resolution, but not for all. This is how I resolved it, but I want some more concrete way so that it will work for all machines and resolution.

This is my working code but it doesn't work for all resolutions as I have used static screen width to fix the issue.

$('.fetched-date input').datepicker({
           dateFormat: 'dd/mm/yy',
           changeYear: true,
           changeMonth: true,
           numberOfMonths: 1,
           buttonImageOnly: true,
           minDate: 0, // Today's date
           maxDate: '+6m', // 6 months from today
           duration: 'fast',
           container: "#divSalaryDetailsClawbackPayheadPopup",
           onSelect: function () {
               // Enable the ddlFreqType dropdown when a date is selected
               $("#ddlFreqType").prop("disabled", false);
           },
           beforeShow: function () {
               debugger;
               setTimeout(function () {
                   var datepicker = $('#ui-datepicker-div');
                   if ($(window).width() > 1364) {
                       datepicker.css('position', 'absolute');
                   } else {
                       datepicker.css('position', 'fixed');
                   }

                   if ($(window).width() == 1232)
                   {
                       datepicker.css('position', 'absolute');
                   }
                   if ($(window).width() == 1812) {
                       datepicker.css('position', 'fixed');
                   }
               }, 0);
           },onChangeMonthYear: function (year, month, inst) {
               // Enforce the position again when the month or year changes
               var datepicker = $('#ui-datepicker-div');
               if ($(window).width() > 1366) {
                   datepicker.css('position', 'absolute');
               } else {
                   datepicker.css('position', 'fixed');
               }
           },
       });
1

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.