Gwt-query doesn't work for my MVP.

Question

I dived to the gwt world a few monthes ago and now am trying to use the gwt-query library. I followed this tutorial: http://code.google.com/p/gwtquery/wiki/GettingStarted Because I am working in Modle-View-Presenter, I tried implementing the above tutorial in my View (that is bound to the ..View.ui.xml), But it dosent seems to work.

I tried creating a lable, and then run the code:

List allGwtLabels = $(".gwt-Label").widgets();

but it selects nothing!

I think I have to point somehow where I want the qwtQuery to search for the widgets (point to my specific ui.xml file)

What am I doing wrong?

Thanks in advance. Below is my code of my Presenter + View + xml that dosent work:

//================================Presenter=================================:

public class QueryPresenter extends
        Presenter<QueryPresenter.MyView, QueryPresenter.MyProxy> {

    public interface MyView extends View {
    }

    @ProxyCodeSplit
    @NameToken(NameTokens.query)
    public interface MyProxy extends ProxyPlace<QueryPresenter> {
    }

    @Inject
    public QueryPresenter(final EventBus eventBus, final MyView view,
            final MyProxy proxy) {
        super(eventBus, view, proxy);
    }

    @Override
    protected void revealInParent() {
        RevealRootContentEvent.fire(this, this);
    }

    @Override
    protected void onBind() {
        super.onBind();
    }
}

//====================================View============================================:

public class QueryView extends ViewImpl implements QueryPresenter.MyView {

    private final Widget widget;

    public interface Binder extends UiBinder<Widget, QueryView> {
    }

    @Inject
    public QueryView(final Binder binder) {
        widget = binder.createAndBindUi(this);

        List<Widget> allGwtLabels = $(".gwt-Label").widgets(); //Doesn't Work!!


        //Also doesn't work!!
        Label label = new Label("Click on me and I will disappear");
        $(label).click(new Function() {
            @Override
            public void f(Widget w) {
                //fade out the label
                $(w).fadeOut(1000);
            }
        });
        _html.add(label);
        //retrieve all attached gwt labels



    }

    @Override
    public Widget asWidget() {
        return widget;
    }
    @UiField Label _label;
    @UiField HTMLPanel _html;
}

//==================xml file===============================

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">

<ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder'
    xmlns:g='urn:import:com.google.gwt.user.client.ui'
    ui:generateFormat='com.google.gwt.i18n.rebind.format.PropertiesFormat'
    ui:generateKeys='com.google.gwt.i18n.rebind.keygen.MD5KeyGenerator'
    ui:generateLocales='default'>

    <g:HTMLPanel ui:field="_html">
        <script type="text/javascript" language="javascript" src="gquerytest/gquerytest.nocache.js"></script>

    <g:Label text="hey" ui:field="_label"/>
    </g:HTMLPanel>
</ui:UiBinder>

Answer 1

try : List allGwtLabels = $(".gwt-Label", widget).widgets();

You have to specify the container of your elements as the elements are not attached to the dom when you try to query them.