【问题标题】:build form in gwt with uiBinder使用 uiBinder 在 gwt 中构建表单
【发布时间】:2013-01-16 15:55:13
【问题描述】:

我正在开发一个需要表单的应用,但我不知道如何制作。我正在寻找有用的信息(手册、书籍等),但找不到任何有用的信息。我想制作一个表单,当用户点击按钮时,我想收集表单的信息。

我正在使用 GWT 和 UiBinder 进行开发。

InterfazUsuario.ui.xml

    <!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"
    >
<g:DockLayoutPanel unit='EM'>
    <g:center>
        <g:FormPanel ui:field="form" action="/InterfazUsuario">
            <g:HTMLPanel height="427px">
                <g:Label text="Idioma:" width="49px"/>
                <g:ListBox visibleItemCount="1" name="lbIdioma" width="118px" ui:field="rellenarIdioma"/>
                <g:Label text="Tipo de Recurso:" width="100px"/>
                <g:ListBox ui:field="rellenarTipoRecurso" name="lbTipoRecurso" visibleItemCount="1" width="118px"/>
                <g:Label text="Motor de Búsqueda:" width="125px"/>
                <g:ListBox name="lbMotorBusqueda" visibleItemCount="1" width="118px"/>
                <g:Label text="Consulta:" width="125px"/>
                <g:TextBox visibleLength="50" name="txtConsulta"/>
                <g:Label text="Número de Recurso:" width="125px"/>
                <g:ListBox name="lbNumRecurso" visibleItemCount="1" width="118px"/>
                <g:Label text="Matriz:" width="125px"/>
                <g:ListBox name="lbMatriz" visibleItemCount="1" width="118px"/>
                <g:Label text="Fila:" width="125px"/>
                <g:ListBox name="lbFila" visibleItemCount="1" width="118px"/>
                <g:Label text="Columna:" width="125px"/>
                <g:ListBox name="lbColumna" visibleItemCount="1" width="118px"/>
                <g:Button width="142px" text="Aceptar" ui:field="btnAceptar"/>
            </g:HTMLPanel>
        </g:FormPanel>
    </g:center>
</g:DockLayoutPanel>

InterfazUsuario.java

public class InterfazUsuario extends Composite {

//interface InterfazUsuarioUiBinder extends UiBinder<Widget, InterfazUsuario> {}
interface InterfazUsuarioUiBinder extends UiBinder<DockLayoutPanel, InterfazUsuario> {}

private static final InterfazUsuarioUiBinder binder = GWT.create(InterfazUsuarioUiBinder.class);

RootLayoutPanel root;

@UiField
ListBox rellenarIdioma;

@UiField
ListBox rellenarTipoRecurso;

@UiField
FormPanel form;

@UiField 
Button btnAceptar;

public InterfazUsuario(List<String> idiomas, List<String> tipoRecurso){
    System.out.println("Entra en el constructor");
    // sets listBox
    initWidget(binder.createAndBindUi(this));
    for (Iterator iter = idiomas.iterator(); iter.hasNext();) {
        System.out.println("Entra en el primer for");
        String name = (String) iter.next();
        rellenarIdioma.addItem(name);

    }

    System.out.println(rellenarIdioma.getItemText(1));

    for(Iterator iter = tipoRecurso.iterator(); iter.hasNext();){
        String tipoRec = (String) iter.next();
        rellenarTipoRecurso.addItem(tipoRec);
    }
    System.out.println("vamos a salir del constructor");

    // Add an event handler to the form.
      form.addSubmitHandler(new FormPanel.SubmitHandler() {
          public void onSubmit(SubmitEvent event) {
           Window.alert("The text box must not be empty");

          }
      });

    form.setAction("/InterfazUsuario");
    form.setEncoding(FormPanel.ENCODING_MULTIPART);
    form.setMethod(FormPanel.METHOD_POST);

    form.addSubmitCompleteHandler(new FormPanel.SubmitCompleteHandler() {
         @Override
         public void onSubmitComplete(SubmitCompleteEvent event) 
                  {Window.alert(event.getResults());                    
         }
      });
    System.out.println("despues de llamar al handler");
    System.out.println(form.getMethod());

}

@UiHandler("btnAceptar")
public void onClick(ClickEvent event) {
        form.submit();                  
    }

public InterfazUsuario(){

}

谢谢。

【问题讨论】:

  • 那么,上面的代码有什么问题?

标签: java gwt uibinder


【解决方案1】:

我不认为这就是 GWT 的使用方式。为什么不给每个 ListBox 一个 ui:field 标识符,然后将 ListBoxes 中的值分配给一个共享数据类,然后通过 RPC 将该类发送到服务器。

【讨论】:

    【解决方案2】:

    您可以通过 GWT 团队基于 UiBinder 的示例代码和单元测试找到大量示例 - http://code.google.com/p/google-web-toolkit/source/search?q=.ui.xml&origq=.ui.xml&btnG=Search+Trunk

    你也应该一步一步去https://developers.google.com/web-toolkit/doc/latest/DevGuideUiBinder

    【讨论】:

      猜你喜欢
      • 2011-02-08
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2013-04-09
      • 1970-01-01
      • 2012-05-18
      相关资源
      最近更新 更多