Ticket #5494 (new defect)
InlineEditBox fails to appear inline
| Reported by: | jeffg | Owned by: | bill |
|---|---|---|---|
| Priority: | high | Milestone: | 1.3 |
| Component: | Dijit | Version: | 1.0 |
| Severity: | major | Keywords: | |
| Cc: |
Description
If a div is absolutely positioned and then a dijit.InlineEditBox? is associated with it, then when the div is clicked on, the inlineEditBox input popup appears at 0,0 and not on top of (inline with) the div.
Looking at the code in postCreate() we can see that only select styles are being copied from the source node. We tried to also have it also copy "top", "left" and "position" by adding another forEach loop, but that didn't work to fix the problem.
Here is a test case:
<html>
<head>
<script type="text/javascript" src="dojo.x/dojo/dojo.js" djConfig="parseOnLoad: true"></script>
<script type="text/javascript">
dojo.require("dijit.layout.ContentPane");
dojo.require("dijit.Toolbar");
dojo.require("dijit.InlineEditBox");
dojo.require("dojo.parser");
function createTextAtPosition( id, x, y, text )
{
var e = document.createElement('div');
e.id = id;
e.style.position = "absolute";
e.style.left = x + "px";
e.style.top = y + "px";
e.style.borderWidth = "1px";
e.style.borderStyle = "solid";
e.style.borderColor = "#ff00ff";
var str = "click to test InlineEditBox appears in place. But instead it will appear under the toolbar!";
e.textContent = str;
var _test = dojo.byId('test');
_test.appendChild( e );
var edit = new dijit.InlineEditBox({width:"150px"}, e.id);
return e;
}
function test()
{
createTextAtPosition( "inlineID", 150, 150, "click to edit" ) ;
createTextAtPosition( "inlineID2", 150, 180, "click to edit" ) ;
2 }
dojo.addOnLoad( test );
</script>
</head>
<body>
<div id="test"></div>
</body>
</html>
Change History
Note: See
TracTickets for help on using
tickets.