{"action":"closed","issue":{"url":"https://api.github.com/repos/eternicode/bootstrap-datepicker/issues/1619","labels_url":"https://api.github.com/repos/eternicode/bootstrap-datepicker/issues/1619/labels{/name}","comments_url":"https://api.github.com/repos/eternicode/bootstrap-datepicker/issues/1619/comments","events_url":"https://api.github.com/repos/eternicode/bootstrap-datepicker/issues/1619/events","html_url":"https://github.com/eternicode/bootstrap-datepicker/issues/1619","id":111708661,"number":1619,"title":"Update calculation when nudging the datepicker due to going off screen when inside a container","user":{"login":"thetimbanks","id":471801,"avatar_url":"https://avatars.githubusercontent.com/u/471801?v=3","gravatar_id":"","url":"https://api.github.com/users/thetimbanks","html_url":"https://github.com/thetimbanks","followers_url":"https://api.github.com/users/thetimbanks/followers","following_url":"https://api.github.com/users/thetimbanks/following{/other_user}","gists_url":"https://api.github.com/users/thetimbanks/gists{/gist_id}","starred_url":"https://api.github.com/users/thetimbanks/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/thetimbanks/subscriptions","organizations_url":"https://api.github.com/users/thetimbanks/orgs","repos_url":"https://api.github.com/users/thetimbanks/repos","events_url":"https://api.github.com/users/thetimbanks/events{/privacy}","received_events_url":"https://api.github.com/users/thetimbanks/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/eternicode/bootstrap-datepicker/labels/has-pr","name":"has-pr","color":"C4EB00"}],"state":"closed","locked":false,"assignee":null,"milestone":null,"comments":1,"created_at":"2015-10-15T21:11:40Z","updated_at":"2015-11-05T21:23:11Z","closed_at":"2015-11-05T21:23:11Z","body":"When displaying the datepicker inside an element other than `body`, the nudging doesn't properly place the datepicker when it detects it went off the screen to the right. \r\n\r\nHere is a scenario where the datepicker is inside another container and on the right side of the container. As you can see the datepicker ends up way off to the right.\r\n\r\nBroken: http://jsfiddle.net/thetimbanks/xefb8vf6/1/\r\n\r\nAfter adjusting the math slightly to determine the correct position, you can see that it is now placed correctly.\r\n\r\nFixed: http://jsfiddle.net/thetimbanks/xefb8vf6/2/\r\n\r\nThe line that changed is where the `left` position gets updated after determining that the datepicker is off the screen. The line looks like:\r\n\r\n`left = offset.left + width - calendarWidth;`\r\n\r\nThe problem exists because the container's offset (`appendOffset`) isn't being taken into account. Fortunately, the `left` variable has already done that calculation for us so you can just substitute `left` in for `offset.left` resulting in:\r\n\r\n`left = left + width - calendarWidth;`\r\n\r\nThis makes sense since you already know where the left side of the input is (`left`), you are then adding the difference of the widths.\r\n\r\nI have submitted a PR to update this line."}}