Dialog component not working
----------------------------
Key: TAPESTRY-1683
URL: https://issues.apache.org/jira/browse/TAPESTRY-1683
Project: Tapestry
Issue Type: Bug
Components: XHR/dhtml/Ajax
Affects Versions: 4.1.2
Environment: Internet Explorer 7, Firefox 2.0
Reporter: Martino Piccinato
The hide()/show() mechanism seems to be not working:
when I click on the link to show the dialog the dialog appears bottom
left and BEHIND the "grey" layer used to disable the rest of the
screen.
I don't have any form whatsoever in my page or in dojo dialog, I
investigated a bit with firebug and this is what appear BEFORE
clicking on "showDialog" link:
<a id="DirectLink" onclick="return
tapestry.linkOnClick(this.href,'DirectLink', false)"
href="/kironweb/StartPage,$DirectLink.sdirect?updateParts=dialogComponent">Toggle
dialog</a>
<script type="text/javascript">
<!--
dojo.addOnLoad(function(e) {
tapestry.widget.synchronizeWidgetState("dialogComponent", "Dialog",
{"bgColor":"black","bgOpacity":0.4000000059604645}, false);
dojo.widget.byId("dialogComponent").hide();});
// -->
</script>
<div id="dialogComponent" class="dojoDialog" dojoattachpoint="wrapper"
style="overflow: visible; position: absolute; z-index: 999; display:
none;">
<span tabindex="0" dojoonblur="clearTrap" dojoonfocus="trapTabs"
dojoattachpoint="tabStartOuter"/>
<span tabindex="0" dojoonblur="clearTrap" dojoonfocus="trapTabs"
dojoattachpoint="tabStart"/>
<div style="position: relative; z-index: 2;"
dojoattachpoint="containerNode"> DIALOG CONTENT</div>
<span tabindex="0" dojoonblur="clearTrap" dojoonfocus="trapTabs"
dojoattachpoint="tabEnd"/>
<span tabindex="0" dojoonblur="clearTrap" dojoonfocus="trapTabs"
dojoattachpoint="tabEndOuter"/>
</div>
<div class="dialogUnderlay" style="position: absolute; top: 0px; left:
0px; z-index: 998; display: none; background-color: rgb(0, 0, 0);
height: 1px; width: 1px;"/>
This is what is in the DOM Tree AFTER pressing the show dialog button:
<div id="dialogComponent" class="dojoDialog" dojoattachpoint="wrapper"
style="visibility: visible; left: 0px; top: 337.5px;"> DIALOG
CONTENT</div>
<div class="dialogUnderlay" style="position: absolute; top: 190px;
left: 0px; z-index: 998; display: block; background-color: rgb(0, 0,
0); height: 318px; width: 1264px; opacity: 0.4;"/>
So, I can see the dialog content but not positioned and "under" the
"dialogUnderlay" div and the application is just blocked.
It's a very basic example on a very basic page, just following the
tutorial. My cache is disabled;
This is the page I'm using to test this:
TestPage.java
public abstract class TestPage extends BasePage {
@Component(type="Dialog",bindings="hidden=hiddenDialog")
public abstract Dialog getMyDialog();
@InitialValue("true")
public abstract boolean isHiddenDialog();
public void setHiddenDialog(boolean hidden);
public void toggleDialog() {
Dialog dialog = getMyDialog();
if (dialog.isHidden()) {
dialog.show();
} else {
dialog.hide();
}
}
}
TestPage.html
<span jwcid="@Border">
<a jwcid="@DirectLink" listener="listener:toggleDialog"
updateComponents="myDialog">Toggle dialog</a>
<div jwcid="myDialog" style="display:none;">
DIALOG CONTENT
</div>
</span>
TestPage.page
<?xml version="1.0"?>
<!DOCTYPE page-specification PUBLIC
"-//Apache Software Foundation//Tapestry Specification 4.0//EN"
"http://jakarta.apache.org/tapestry/dtd/Tapestry_4_0.dtd";>
<page-specification>
</page-specification>
--
This message is automatically generated by JIRA.
-
You can reply to this email to add a comment to the issue online.
---------------------------------------------------------------------
To unsubscribe, e-mail: [EMAIL PROTECTED]
For additional commands, e-mail: [EMAIL PROTECTED]
