jsf managed bean method's string in html - jsf

Hi i have this method in managed bean.
public String instructionsText() {
String text = "Whether your web site needs a simple 'face lift' <br /> "+
" major 'reconstructive surgery,' the staff of"
return text;
}
in my jsf page :
<img src="http://icons.iconarchive.com/icons/aroche/delta/32/Help-icon.png" style="float:right" onclick="PF('dlgi').show();" alt="help" />
I want a line break in string text at the place of <br />.But i tried in different ways
(\n, \r\n, \r ,<br> , <br />).Nothing worked.Help would be greatly appreciated.Thank you.

There is a escape attribute for h:outputText, a Boolean flag which indicates whether to escape the HTML content or not.
By default the value is true. Set the value as escape="false".
You can find the Doc Ref HERE.

Related

JSF h:commandLink with hml entity characters, superscript etc

What is the best way of using special characters and formatting in a dynamically generated h:commandLink?
I am rendering an equation (e.g. A=π*r2) as a list of h:commandLink items, so that each symbol in the equation can be separately clicked:
JSF:
<ui:repeat value="#{eqBean.eqSymbolDisplays}" var="eqSym">
<h:commandLink value="#{eqSym.text}" styleClass="#{eqSym.styleClass}" action="#{eqBean.eqSymbolClick(eqSym)}" />
</ui:repeat>
Bean:
public String getText(){
// Return the text for a given symbol
}
The question is what the getText method should do when the symbol needs a special character, special mathematical symbol, and/or needs to be a super-script or sub-script?
Here are some specific problems/questions:
(1) How do I use the greek letter π symbol in a CommandLink? If I return π then that is what gets displayed, not the greek symbol
(2) What is the best way to do a superscript in a CommandLink? I could use a CSS style but some people say that is a bad idea, especially when the superscript implies meaning, rather than just presentation, as it does for a number raised to a power.
See :
Beware CSS for Superscript/Subcript
The answer was obvious in the end: Just replace the value attribute of the h:commandLink with a child h:outputText element that has escape="false" :
JSF:
<ui:repeat value="#{eqBean.eqSymbolDisplays}" var="eqSym">
<h:commandLink styleClass="#{eqSym.styleClass}" action="#{eqBean.eqSymbolClick(eqSym)}" >
<h:outputText value="#{eqSym.htmlText}" escape="false"/>
</h:commandLink>
</ui:repeat>

rich:toolTip not handling String values that contain quotes

I have ran into a particularly strange problem when implementing a RichFaces tool tip component. In my project I have a table that displays a list of Strings that are entered by the user, and I want there to be a pop-up of additional information when a user mouses over the strings in the list.
One of the requirements is that any string that is more than one word must contain double quotes "" when input by the user--e.g. a single word would be input as Java vs. a phrase "Java is cool".
So, I added a <rich:toolTip> to render additional info if it exists--and it works, except for strings that contain double-quotes. For example (as it's displayed in the table) "sample string" will not show additional information on mouseover.
My JSF code is simply:
<h:outputText id="keywordText" value="#{keywordData.keyword}"/>
<rich:toolTip for="keywordText" rendered="#{keywordData.comments != null}" value="#{keywordData.comments}"/>
Like I said, this works for words/strings that do not contain quotes. I am wondering if there is a workaround within JSF/RichFaces I can use in order to get this to work properly with a string that contains quotes. Or perhaps some assistance in writing a custom JavaScript function that forces or "tricks" RichFaces into handling quotation marks in a string correctly?
Thanks for any help in advance!
Edit: I am using RichFaces 3.3.3
In the page source, for the string "Testing Quotes" (does not work) I found this:
<span id="j_id138:j_id144:keywordTable:"Testing Quotes":keywordText">"Testing Quotes"</span>
<span id="j_id138:j_id144:keywordTable:"Testing Quotes":j_id159" class="rich-tool-tip " style="z-index:99; ">
<span id="j_id138:j_id144:keywordTable:"Testing Quotes":j_id159content">
<p>This comment should display</p>
</span>
<span id="j_id138:j_id144:keywordTable:"Testing Quotes":j_id159script" style="display:none">
<script id="scriptj_id138:j_id144:keywordTable:" quotes":j_id159"="" testing="" type="text/javascript">
new ToolTip("j_id138:j_id144:keywordTable:"Testing Quotes":j_id159","j_id138:j_id144:keywordTable:"Testing Quotes":keywordText",{'showEvent':'mouseover'} );
</script>
</span>
You can see that the quotations in the string itself (which appears to supposed to be part of the id attribute) are being misinterpreted in the new ToolTip parameters. And for a string testkeywordawesome without quotes you can see it works (because it does not contain quotes):
<span id="j_id138:j_id144:keywordTable:testkeywordawesome:keywordText">testkeywordawesome</span>
<span id="j_id138:j_id144:keywordTable:testkeywordawesome:j_id159" class="rich-tool-tip " style="z-index: 99; visibility: hidden; display: none; left: 63.7833px; top: 210.75px;">
<span id="j_id138:j_id144:keywordTable:testkeywordawesome:j_id159content">
<p>the best comment in the world</p>
</span>
<span id="j_id138:j_id144:keywordTable:testkeywordawesome:j_id159script" style="display:none">
<script id="scriptj_id138:j_id144:keywordTable:testkeywordawesome:j_id159" type="text/javascript">
new ToolTip("j_id138:j_id144:keywordTable:testkeywordawesome:j_id159","j_id138:j_id144:keywordTable:testkeywordawesome:keywordText",{'showEvent':'mouseover'} );
</script>
</span>
Edit2: The tool tips exists in a rich:column, of which exists in a rich:extendedDataTable. Below are their code:
<rich:extendedDataTable value="#{keywordEntry.globalKeywordsDataModel}"
rendered="#{fn:length(keywordEntry.globalKeywords) gt 0}"
styleClass="removeEDTSortIcon removeEDTContextMenu"
id="keywordTable" rowClasses="row1, row2"
var="keywordData" rows="0" noDataLabel=" "
headerClass="#{displayHeader == null or displayHeader ? 'rich-table-header' : 'hide'}"
rowKeyVar="keywordRowIdx" enableContextMenu="false"
sortMode="#{globalKeywordListSort.multiSortEnabled ? 'multi' : 'single'}"
sortPriority="#{globalKeywordListSort.sortOrderList}"
width="#{eStaffUser.userKeywordAdmin ? '750px' : '750px'}"
height="#{((fn:length(keywordEntry.globalKeywords)*30 + 50) lt 480) ? (fn:length(keywordEntry.globalKeywords)*30 + 50) : 480}px"
>
and
<rich:column id="#{globalKeywordSortFieldEnumBean.KEYWORD}" selfSorted="false" width="#{eStaffUser.userKeywordAdmin ? '48%' : '52%'}" sortBy="#{keywordData.keyword}"
sortOrder="#{globalKeywordListSort.dataTableColumnSortClass[globalKeywordSortFieldEnumBean.KEYWORD].sortOrder}">
id="j_id138:j_id144:keywordTable:"Testing Quotes":keywordText"
This means that one of the parents of <h:outputText id="keywordText"> has its id defined by something that evaluates to "Testing Quotes", that's obviously bad.
OK, so the root of the issue was that the rich:extendedDataTable uses an ID supplied by each entry to generate a unique ID for each table row. So the problem ended up being in the underlying "Model Managed-Bean" that implemented a generic data entity interface, this interface defines a getEntityId() method and in this case, the "ID" returned was the keyword value itself, since there was no true (i.e., database) entity ID such as a primary key:
public class KeywordDataBean implements SummaryDataEntityIF<String>
The problem was resolved by changing the interface's implementation to Integer and returning the hash as the unique ID for each keyword object:
public class KeywordDataBean implements SummaryDataEntityIF<Integer>
This forced the html id generated by the rich:extendedDataTable to be a simple integer number instead of a (keyword) string containing quotes, allowing the rich:toolTip to work properly.

How can I add attributes to components which don't have their own renderers using the f:attribute component?

I want to write a custom renderer for the h:selectOneMenu component and eventually make use of the description property of the UISelectItem class to add a title a.k.a. tooltip to f:selectItems following BalusC's profound guides in https://stackoverflow.com/a/25512124/3280015 and http://balusc.blogspot.de/2008/08/styling-options-in-hselectonemenu.html.
Now I did extend the com.sun.faces.renderkit.html_basic.MenuRenderer in my own CustomMenuRenderer, registered it with the faces-config.xml and overrode the renderOption method, adding the following code before option tag is terminated by the Responsewriter:
String titleAttributeValue = (String) component.getAttributes().get("title");
if (titleAttributeValue != null) {
String indexKey = component.getClientId(context)
+ "_currentOptionIndex";
Integer index = (Integer) component.getAttributes().get(indexKey);
if (index == null) {
index = 0;
}
component.getAttributes().put(indexKey, ++index);
}
I'm not quite sure I'm doing the indexKey thing right or whether I need it for the title attribute or should use a writer.writeAttribute("title", titleAttributeValue, null); instead because I don't have a list like in the optionClasses tutorial, but the code works so far!
In the actual view definition use case I did:
<h:selectOneMenu value="#{cc.data}">
<f:attribute name="title" value="outerTEST" />
<c:forEach items="#{cc.list}" var="val">
<f:selectItem value="#{val}" itemValue="#{val}" itemLabel="#{val.label}">
<f:attribute name="title" value="innerTEST #{val.description}" />
</f:selectItem>
</c:forEach>
</h:selectOneMenu>
(I just put the #{val.description} there in the title value to clarify my intention, it is currently still empty and I will have to think about how to populate it per element later, but for the sake of the question we can assume it is already filled.)
But now I'm getting the "outerTEST" properly showing up in the title attribute of the option in the resulting XHTML in the Browser, yet I'm not seeing any of the "innerTEST" which would and should be individual per selectItem and which is what this is eventually all about.
I understand the f:selectItem and f:selectItemscomponents do not have their own renderers but rendering of options is generally handled by the MenuRenderer via its renderOption method.
But how then would I add individual titles to the individual selectItems??
Thanks

Can't we give two values for one lable in JSF?

I have one label field which is license and I want give two license numbers for this..how to give two values here. I have one properties file (manageprofile) and one java class (manageprofiledatabean) which contains the license values
<h:outputLabel value="#('label.manageprofile.license')"/>
<h:outputText value="#{manageProfileDataBean.license}" />
<h:outputText escape="false" value=" "></h:outputText>
Concat both values in one string variable of manageProfileDataBean and then set it in
public class ManageProfileDataBean{
private String license = "";
private String val1 = "val1":
private String val2 = "val2";
public ManageProfileDataBean(){
license = val1+val2;
}
//setter getter
}
firstly, h:outputLabel is meant to be used for labelling input controls - it renders as the html <label> tag(e.g.)
<h:outputLabel for="myname" value="#{bean.labelValue}" />
<h:inputText id="myname" value="#{bean.name} />
If you need to specify multiple values in expression language you can do so like this:
<h:outputText value="#{bean.property1 bean.property2}"/>
so I guess in your case you would write it as
<h:outputText value="#{'label.manageprofile.license' manageProfileDataBean.license}" />
Finally, you don't need to use an h:outputText if you're not referenceing any propery so the last pair of nbsp characters don;t need to be in in outputText tag at all.

How to bold specific Strings in an h:column

I have a JSF data table that is displaying data based off a search successfully. However, I'm not sure how to selectively bold certain text data in a particular column.
So, for instance, I would like this text...
Here is some text that would be inside the h:column
to show up like this on the page...
Here is some text that would be inside the h:column
Here's what my data table looks like
Results:
<h:dataTable var="results"
value="#{logSearcherBean.results}"
border="1">
<h:column>#{results.logName}</h:column>
<h:column>#{results.matchLine}</h:column>
</h:dataTable>
You could either homebrew an EL function which manipulates the column value and returns the desired HTML,
<h:outputText value="#{my:highlight(results.logName, logSearcherBean.query)}" escape="false" />
(note that this is due to escape="false", which is mandatory to present HTML literally, also sensitive to XSS attacks if the logName is a value which is fully controlled by the enduser)
Or grab JavaScript/jQuery which manipulates the returned HTML, see also this related question: Highlight a word with jQuery.
Hi all,
<p:column id="lastName"
headerText="Last Name">
<h:outputText value="#{person.lastName}" style="#{myBean.getStyle(person.lastName)}"/>
</p:column>
And in the bean:
public String getStyle(String str) {
return str.equals(keyword) ? "background-color: yellow" : "";
}
All best and happy coding!

Resources