Archive for April, 2011

Detect if JavaScript is enabled

Posted by smoreau in Html on 19 Apr 2011

Because of the emergence of Ajax, people don’t disable JavaScript much nowadays.
I don’t know the percentage of people having disabled JavaScript. It is likely under 5%. But if you have a website visited by millions of visitors every month, even 1% is matter!

This is why I wrote the following code:

<noscript>JavaScript is DISABLED.</noscript>
<span id="displayIfJavaScript" style="display:none">JavaScript is ENABLED.</span>

<script>
document.getElementById('displayIfJavaScript').style.display = "block";
</script>

The text under the noscript tag will be displayed if JavaScript is disabled or not supported. The text under the span tag is not displayed by default and will be showed using JavaScript, this is why we can be sure JavaScript is enabled in that case.
You can obviously change the content of the noscript and span tags. You could, for example, hide a form which uses JavaScript validation to non-JavaScript users by putting the HTML code of the form under the span tag.

Please see below the above script in action:

, ,

No Comments

Close ModalPanel if no error

Posted by smoreau in Java on 03 Apr 2011

It has been a very long time I wrote this code, but I thought I would share it with you as it is quite useful.

If like me, you are an adept of RichFaces, you might have already seen and used the modal panel functionality. By default, a modal panel is used to display a message, but what if you actually want to display a form within it? How nice would it be if, for example, you could put your login form in a modal panel instead of opening a new page?

With the following steps, you will be able to achieve this:

  • First, get the maximum severity in the message queue: 
    <a4j:outputPanel ajaxRendered="true">
    <h:form style="display:none" id="maximumSeverityForm">
        <h:inputHidden id="maximumSeverity"
            value="#{facesContext.maximumSeverity.ordinal}"/>
    </h:form>
</a4j:outputPanel>

    This form has to be placed on all your pages using an include for example. This form will basically get refreshed on every postback and will contain the maximum severity in the message queue or null if the queue is empty.

  • Create a JavaScript method which reads the maximumSeverity hidden field: 
    function ajaxRequestContainsErrors() {
    return document.getElementById("maximumSeverityForm:maximumSeverity").value > 0;
}

    This method has to also be included in all the pages.

  • Finally, use the following code for the “Submit” button in your form: 
    <a4j:commandButton action="#{userBean.loginAction}" value="Submit" oncomplete="if (!ajaxRequestContainsErrors()) {Richfaces.hideModalPanel('loginModalPanel');}"/>

    This button is actually checking if there is no error before closing the modal panel.

, , ,

No Comments