Attribute 'for' of label component with id xxxx is not defined

I got the warning in the log file when I have used the tag <h:outputLabel> without attribute "for" in xhtml file. It was really polluting my server log files.

The logged information actually makes sense anyway! We could find an answer as the following:

"Having h:outputLabel without a "for" attribute is meaningless. If you are not attaching the label, you should be using h:outputText instead of h:outputLabel."

However, these solutions are not possible just for my situation. Instead of using h:outputText for only displaying text, my team has used h:outputLabel too many places. We were nearly in our release time (next day) so it is quite risky and takes much efforts if we try to correct it. Because the style (with CSS) is already done with h:ouputLabel. The alternative by adding attribute "for" the existing h:outputLabel is not reasonable either. I really need to find another solution.

**Fortunately, I came across a way if I change to use p:outputLabel, the warning won't be logged! What?**

I was just curious to know why; so then I decided to delve into the implementation of outputLabel of both Primefaces and Myfaces source code (at grepcode.com). I found the reason is:

In Myfaces (1.2.2), we can easily to find the line of code below in method "encodeBegin" in class "HtmlLabelRenderer". It is executed whether the attribute "for" is null.

log.warn("Attribute 'for' of label component with id " 
+ uiComponent.getClientId(facesContext)+" is not defined");

However, Primefaces (5.2) does not. In class "OutputLabelRenderer", it uses the default implementation of method "encodeBegin" from superclass without logging. Ahh! The method "encodeBegin" is just a hook!

Okay! The reason is clear. I saw that the only difference of HTML rendering between h:outputLabel and p:outputLabel is as below:

1. <h:ouputLabel> will be rendered to become <label>
2. <p:outputLabel> will be rendered to become <label class="ui-outputlabel">

It should be an acceptable approach to fix the issue in my case. I just do a little bit more with style and I can achieve my goal without spending much efforts for testing whole the application again. Yeah!

Something like this:

1. XHTML

<h:panelGroup layout="block" styleClass="child-add-ons-container">

    <ul>

        <li>

            <h:panelGroup layout="block" styleClass="type-of-check">

                <p:outputLabel value="bonity"></p:outputLabel>

            </h:panelGroup>

        <li>

        ....

    <ul>

</h:panelGroup>

2. CSS: just make sure the style of p:outputLabel is the same with current style of h:outputLabel, for example:

.add-ons-compliance-check .type-of-check label.ui-outputlabel {

    font-style: normal; /*style of tag label in our app*/

    color: inherit;  /*style of tag label in our app*/

    font: inherit;  /*style of tag label in our app*/

}

References
[1]. http://stackoverflow.com/questions/12744264/attribute-for-of-label-error
[2]. http://docs.oracle.com/javaee/5/javaserverfaces/1.2/docs/tlddocs/h/outputLabel.html
[3]. http://grokbase.com/t/myfaces/users/143vdzqp11/how-to-disable-label-warnings
[4]. http://grepcode.com/file/repo1.maven.org/maven2/org.primefaces/primefaces/5.2/org/primefaces/component/outputlabel/OutputLabelRenderer.java?av=f
[5]. http://grepcode.com/file/repository.springsource.com/org.apache.myfaces/com.springsource.org.apache.myfaces/1.2.2/org/apache/myfaces/renderkit/html/HtmlLabelRenderer.java?av=f

Comments

Set up a web server for learning HTTP headers

Motivation We all follow the client-server model using the HTTP protocol for most of our web apps today. In development, we simply may have a backend API server and a frontend (web pages or mobile apps) only. However, it seemed that a proxy server is always required for production. In fact, most of the hardest issues in production come from integration. The requests and responses might be modified by the proxy server. Therefore, the understanding of HTTP protocol is one of the key skills to resolve those issues. I wanted to dive deep into HTTP with some core concepts such as caching, cookies, and CORS. I didn't intend to go quickly rather than moved slowly to have a well understanding of what I do. Prepare a server The easiest way is to use my laptop as a server then I can just use "localhost". I can also use ngrok to make my web server online. Finally, I use an online tool such as RedBot to check the HTTP headers. To make it more excited though, I deployed the app on A...

What the heck is Meteor DDP?

I was using Meteor for my messenger project. I was so curious about the real time connection. I wanted to know how exactly this mechanism works. In this post, I will go through the DDP Specification, an overview of WebSocket, and a simple demo about how to subscribe a publication of Rocket.Chat (containing a DDP server) from an external webpage. At a glance, I knew that Meteor invented a protocol called DDP which uses for handling real time connection. So then, what is DDP? "DDP (Distributed Data Protocol) is the stateful WebSocket protocol that Meteor uses to communicate between the client and the server." [1] All right! Why does DDP matter? "DDP is a standard way to solve the biggest problem facing client-side JavaScript developers: querying a server-side database, sending the results down to the client, and then pushing changes to the client whenever anything changes in the database" . [2] In order to understand deeply the protocol, I decided ...

DevOps Toolchain Enhancement

Historically, our company ubitec had started with a customer project. Agile/Scrum was our proposal for working with customers. Time by time, Agile/Scrum also became our culture for software development. To be successful with this development approach, we somehow needed to have a fast release for customers (i.e. every one week). Back then, we had a build tool Jenkins which was responsible for having sprint release packages for our customers. The build job pipelines contain some steps such as gathering the artifacts, checking the code convention, running the tests, building docker images, and packaging an archived file (a zip file). The set of tools involved in a pipeline is roughly called a toolchain. It is just a part of a bigger process called the DevOps toolchain. Source: https://www.ibm.com/blogs/cloud-archive/2016/11/devops-architecture-available-on-bluemix-garage-method-site/ DevOps is a proven method that fits Agile. Today, it is even treated as a mandatory factor...

Awareness of Product Development

Software development can be understood simply as a program to receive inputs (i.e customer needs) and then produce outputs (i.e working software). It is worth it to know how many steps are in that program. When something gets stuck in a step, everyone is aware of that. The first painting of my son The General Process Big Picture There are two main factors in this picture including the people with roles and their interactions. All people involved in developing the product know their responsibilities clearly and how to make things done right. Therefore, a good collaboration can be reached. Product Roadmap Contribution It would be great for developers to know what the next features to work on are as well as when those features will be delivered. Therefore, the product roadmap is very important. The items in the roadmap should be contributed by ALL people involved in the product. Because software engineers directly develop, test, delivery, and monitor the software, they should also contrib...

How I did customize "rasa-nlu-trainer" as my own tool

Check out my implementation here Background I wanted to have a tool for human beings to classify intents and extract entities of texts which were obtained from a raw dataset such as Rocket.chat's conversation, Maluuba Frames or here . Then, the output (labeled texts) could be consumed by an NLU tool such as Rasa NLU. rasa-nlu-trainer was a potential one which I didn't need to build an app from scratch. However, I needed to add more of my own features to fulfill my needs. They were: 1. Loading/displaying raw texts stored by a database such as MongoDB 2. Manually labeling intents and entities for the loaded texts 3. Persisting labeled texts into the database I firstly did look up what rasa-nlu-trainer 's technologies were used in order to see how to implement my mentioned features. At first glance rasa-nlu-trainer was bootstrapped with Create React App. Create React App is a tool to create a React app with no build configuration, as it said. This too...

vhandit

Search This Blog