2

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>
Michael
  • 938
  • 2
  • 11
  • 18
  • Thanks. It works for the List allGwtLabels = $(".gwt-Label", widget).widgets(); But I am still unable to make this work: $(label, _html).click(new Function() { @Override public void f(Widget w) { //fade out the label $(w,_html).fadeOut(1000); } }); – Michael Apr 14 '12 at 16:21

1 Answers1

2

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.

jdramaix
  • 1,104
  • 6
  • 9
  • I managed to do this by using gwt clickHandler. But is it "clean" or should I keep and try make this work with the GQuery click method? This Works: label.addClickHandler(new ClickHandler() { @Override public void onClick(ClickEvent event) { $(label).fadeOut(1000); } }); – Michael Apr 14 '12 at 16:58
  • _html.add(label); $(label).click(new Function() { public void f() { //fade out the label $(label).fadeOut(1000); } }); Should work – jdramaix Apr 15 '12 at 19:47