-
1. Re: Display problem with tooltip element
ilya_shaikovsky Mar 16, 2009 9:15 AM (in response to floriand)check please with fireBug the styles applied to your tooltip.
-
2. Re: Display problem with tooltip element
floriand Mar 16, 2009 11:33 AM (in response to floriand)Hi ilya_shaikovsky,
thanks for your reply.
Firebug shows the following:<span id="frm_content:dtb_frm_content:1:j_id47:0:j_id48" class="dr-rich-tool-tip rich-tool-tip" style="z-index: 99; background-color: white; width: 500px; visibility: hidden; display: none; left: 28px; top: 290px;"> <span id="frm_content:dtb_frm_content:1:j_id47:0:j_id48content"> History: <br/> <span style="color: gray; text-decoration: none;"> Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text <br/> </span> Category: <br/> <span style="color: gray; text-decoration: none;"> Continuous Improvement <br/> </span> </span> <span id="frm_content:dtb_frm_content:1:j_id47:0:j_id48script" style="display: none;"> <script id="scriptfrm_content:dtb_frm_content:1:j_id47:0:j_id48" type="text/javascript"> 1 2new ToolTip({'showEvent':'mouseover','delay':0,'hideEvent':'','hideDelay':0} ,{'onshow':null,'onhide':null,'oncomplete':null} ,"frm_content:dtb_frm_content:1:j_id47:0:j_id48","frm_content:dtb_frm_content:1:j_id47:0:reportItemsTableColumn_dt_id","client",false,"bottom-right",false,10,10,function(event,ajaxOptions){A4J.AJAX.Submit('_viewRoot','frm_content',event,ajaxOptions)},{'control':this,'oncomplete':function(request,event,data){;{var _toolTip = $('frm_content:dtb_frm_content:1:j_id47:0:j_id48').component;_toolTip.toolTipContent = $('frm_content:dtb_frm_content:1:j_id47:0:j_id48content');_toolTip.displayDiv();}},'similarityGroupingId':'frm_content:dtb_frm_content:1:j_id47:0:j_id48','parameters':{'frm_content:dtb_frm_content:1:j_id47:0:j_id48':'frm_content:dtb_frm_content:1:j_id47:0:j_id48','ajaxSingle':'frm_content:dtb_frm_content:1:j_id47:0:j_id48'} ,'onbeforedomupdate':function(request,showEvent,data){;{ var _toolTip = $('frm_content:dtb_frm_content:1:j_id47:0:j_id48').component;_toolTip.toolTip.style.display = 'none'; }},'actionUrl':'/fode/report.faces'} );; 3 4 </script> </span> </span>
The Some text Some text... part is shown in one line and not broken when the width of the tooltip is reached...
I forgot to mention that I also adjusted the style for the tooltip (as you also can see in the firebug output):toolTip.setStyle("background-color:white;width:500px;");
Moreover it might be important how I added the tooltip into the element tree.
I added the tooltip to a column, which was also created programmatically:HtmlColumn columnId = new HtmlColumn(); columnId.setId("reportItemsTableColumn_dt_id"); .... columnId.getChildren().add(toolTip); toolTip.setFor("reportItemsTableColumn_dt_id");
Thanks for your help! -
3. Re: Display problem with tooltip element
floriand Mar 17, 2009 7:50 AM (in response to floriand)nobody?
-
4. Re: Display problem with tooltip element
ilya_shaikovsky Mar 17, 2009 8:19 AM (in response to floriand)<span id="frm_content:dtb_frm_content:1:j_id47:0:j_id48" class="dr-rich-tool-tip rich-tool-tip" style="z-index: 99; background-color: white; width: 500px; visibility: hidden; display: none; left: 28px; t op: 290px;">
this span changed with JS to visibility:'' and display:block. So the text inside should be wrapped to the width as it become block element. And actually it's wrapped on my side.
I still can't reproduce the error in FF 3 trying different doctypes. also tried to define it within the column as in your case. -
5. Re: Display problem with tooltip element
floriand Mar 17, 2009 9:25 AM (in response to floriand)Hi,
I figured out what the problem is. I appended the html fragment which contains the tooltip to the form tag (with fireburg), then the tooltip was shown as expected. In the code I posted I appended the tooltip to the column, this seems to be responsible for the wrong display.
Now I tried to append the tooltip to a tag outside the table also in the code. But since the span tag the tooltip is rendered to is only created once then, it doesn't bring the expected result.
Do you have an idea how to solve this?
Thanks -
6. Re: Display problem with tooltip element
flo_d Mar 19, 2009 5:27 AM (in response to floriand)any ideas?
-
7. Re: Display problem with tooltip element
ilya_shaikovsky Mar 19, 2009 5:55 AM (in response to floriand)
Now I tried to append the tooltip to a tag outside the table also in the code. But since the span tag the tooltip is rendered to is only created once then, it doesn't bring the expected result.
The problem described there not clear for me.. Do you mean that it doesn't works at all attached to some element outside the table? Define the id explicitly to the component parent to tooltip. -
8. Re: Display problem with tooltip element
floriand Mar 25, 2009 2:26 AM (in response to floriand)what I did was the following:
1)HtmlColumn columnId = new HtmlColumn(); ... HtmlOutputLink linkId = new HtmlOutputLink(); linkId.setId("linkId"); ... HtmlOutputText textId = new HtmlOutputText(); textId.setId("textId"); ... HtmlToolTip toolTip = new HtmlToolTip(); toolTip.setFor("textId"); textId.getChildren().add(toolTip); linkId.getChildren().add(textId); columnId.getChildren().add(linkId);
This worked (nearly) as expected, the tooltip appeared but it didn't fit into the tooltip box (the problem why I opened this post).
2) Then I took the rendered html and modified the html directly with firebug without touching the jsf or java code. I removed the rendered tooltip element (span) which was a child of the link (a) and appended it to the root form element. Then the tooltip was rendered as expected.
3) I bound the form element of the jsf page (h:form) to an attribute of my backing bean and then tried to add the tooltip to the form, but set the id of the text element in the setFor method<h:form id="frm_content" binding="#{report.form}"> ...
HtmlColumn columnId = new HtmlColumn(); ... HtmlOutputLink linkId = new HtmlOutputLink(); linkId.setId("linkId"); ... HtmlOutputText textId = new HtmlOutputText(); textId.setId("textId"); ... HtmlToolTip toolTip = new HtmlToolTip(); toolTip.setFor("textId"); this.form.getChildren().add(toolTip); linkId.getChildren().add(textId); columnId.getChildren().add(linkId);
But unfortunately this didn't work at all, the tooltip is not shown when I move over the link.
Any ideas how to resolve this? -
9. Re: Display problem with tooltip element
nbelaevski Mar 25, 2009 8:07 AM (in response to floriand)Hello,
Tooltip cannot be attached to h:outputText, please enclose text into a4j:outputPanel and attach tooltip to it. -
10. Re: Display problem with tooltip element
floriand Mar 25, 2009 3:00 PM (in response to floriand)Hi,
I tried the following, but the problem still exists:... HtmlAjaxOutputPanel outputPanelId = new HtmlAjaxOutputPanel(); outputPanelId.setId("outputPanelId"); linkId.getChildren().add(outputPanelId); HtmlOutputText textId = new HtmlOutputText(); ... outputPanelId.getChildren().add(textId); HtmlToolTip toolTip = new HtmlToolTip(); toolTip.setFor("textId"); outputPanelId.getChildren().add(toolTip); ...
The problem is the same as before, the tooltip get's rendered but the text is not wrapped as expected.
Any other ideas how to solve this? -
11. Re: Display problem with tooltip element
floriand Mar 25, 2009 3:01 PM (in response to floriand)Hi,
I tried the following, but the problem still exists:... HtmlAjaxOutputPanel outputPanelId = new HtmlAjaxOutputPanel(); outputPanelId.setId("outputPanelId"); linkId.getChildren().add(outputPanelId); HtmlOutputText textId = new HtmlOutputText(); ... outputPanelId.getChildren().add(textId); HtmlToolTip toolTip = new HtmlToolTip(); toolTip.setFor("textId"); outputPanelId.getChildren().add(toolTip); ...
The problem is the same as before, the tooltip get's rendered but the text is not wrapped as expected.
Any other ideas how to solve this? -
12. Re: Display problem with tooltip element
floriand Mar 26, 2009 11:25 AM (in response to floriand)no ideas?