#8298 closed bug (wontfix)

Opened May 07, 2012 09:56AM UTC

Closed May 20, 2012 06:23PM UTC

DatePicker button off when using position absolute

Reported by: dave.juery7 Owned by: dave.juery7
Priority: minor Milestone: 1.9.0
Component: ui.datepicker Version: 1.8.12
Keywords: Cc:
Blocked by: Blocking:
Description

When using position:absolute, the button does not line up with the input field. It shows up in the upper left of the client window.

Attachments (0)
Change History (4)

Changed May 07, 2012 01:20PM UTC by scottgonzalez comment:1

owner: → dave.juery7
status: new → pending

Please provide a reduced test case showing the problem.

Changed May 20, 2012 08:58AM UTC by dave.juery7 comment:2

status: pending → new

I have a file in jsFiddle, but don't know how to save it or post it to this page. So below is the code.

<!doctype html>

<html>

<meta http-equiv='Content-type' content='text/html;charset=UTF-8'>

<head>

<title> Calendar Test </title>

<link rel="stylesheet" type="text/css" media="all"

href="http://code.jquery.com/ui/1.8.20/themes/base/jquery-ui.css" />

<link rel="stylesheet" type="text/css" media="all"

href="http://static.jquery.com/ui/css/demo-docs-theme/ui.theme.css" />

<style>

*.Date {

position:absolute;

text-align: left;

font-family: "Courier New", monospace;

font-size: 10pt;

color: navy; background-color: rgb(230,240,250);

}

</style>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">

</script>

<script src="http://code.jquery.com/ui/1.8.20/jquery-ui.min.js">

</script>

<script type='text/javascript'>

$(function() {

$('.Date').attr('autocomplete','off').datepicker({

changeMonth: true, changeYear: true,

gotoCurrent: true,

showOn: 'button',

buttonText: 'cal1',

buttonImage: '/images/Calendar.gif',

buttonImageOnly: true,

constrainInput: false

});

});

</script>

</head>

<body>

<form id='test' name='test' method='post'>

<input type="submit" id="Test" name="Test" value="Test">

<input class='Date' style='left:150px;top:200px;' id='TestDate'>

</body>

</html>

​

Changed May 20, 2012 09:22AM UTC by dave.juery7 comment:3

http://jsfiddle.net/Proviss/BsgzH/ http://jsfiddle.net/Proviss/BsgzH/

Changed May 20, 2012 06:23PM UTC by scottgonzalez comment:4

resolution: → wontfix
status: new → closed

An actually reduced test case: http://jsfiddle.net/BsgzH/4/

This works as designed and will have completely different behavior in the rewrite.