Jquery ResourceDependency annotation doesn't work in a UIComponent

Question

I'm developing a UIComponent that uses Jquery with @ResourceDependency annotation, but in Run time show in console this "Uncaught ReferenceError: $ is not defined";

Java code:

@FacesComponent(value = "components.InputInditec", createTag = true, 
                   tagName = "InputInditec")
@ResourceDependencies({
    @ResourceDependency(library = "jquery", name = "jquery-203.js", target
            = "head")})
public class UiInputInditec extends UIComponentBase {

    @Override
    public String getFamily() {
        return "my.custom.component";
    }

    @Override
    public void encodeBegin(FacesContext context) throws IOException {

        String value = (String) getAttributes().get("value");
        String clientId = getClientId(context);

        ResponseWriter writer = context.getResponseWriter();
        writer.startElement("input", this);
        writer.writeAttribute("id", clientId + "edit", "id");
        if (value != null) {
            writer.writeAttribute("value", value.toUpperCase(), "value");
        }
        writer.endElement("input");

        writer.startElement("script", this);
        writer.writeAttribute("type", "text/javascript", null);
        writer.write("$(\"#" + clientId + "edit" + "\").keypress(function() { "
                + "console.log( 'Handler for .keypress() called.' ); });");
        writer.endElement("script");

    }
}

Anybody knows what's happening?

Answer 1

This @ResourceDependency declaration,

@ResourceDependency(library="jquery", name="jquery-203.js", target="head")

expects the JS file to be in exactly the following location:

WebContent
|-- META-INF
|-- WEB-INF
|-- resources
|    `-- jquery
|         `-- jquery-203.js
:

Make sure that this is true. When pulling the page in browser, doing a rightclick, View Source so that you see the JSF generated HTML output, make sure that you see a concrete /javax.faces.resource URL in the generated <script> element and thus not a RES_NOT_FOUND URL which indicates that the physical JS resource couldn't be resolved based on the given library and name.