2012-02-17 4 views
1

J'ai pour tâche de concevoir un contrôle de taille ComboBox (GXT) avec fonction multi-sélection. J'ai essayé de définir CheckBoxListView en utilisant setView de ComboBox mais je n'ai pas semblé fonctionner. Quelqu'un peut-il me guider s'il est possible d'utiliser le framework GXT?GXT - ComoboBox avec fonction de sélection multiple

PS: J'ai trouvé un composant appelé XComboBox dans le forum sencha (classe java, code source) qui fonctionne bien, mais ne peux pas être utilisé comme sous GNU GPL Licence

Merci à l'avance!

Répondre

5

Merci @smiletolead pour votre aide, j'ai trouvé une solution en intégrant Dialog avec CheckBoxListView et TriggerField.

La liste de code est ..



    package com.ui.test.client; 

    import java.util.List; 

    import com.extjs.gxt.ui.client.data.ModelData; 
    import com.extjs.gxt.ui.client.event.ComponentEvent; 
    import com.extjs.gxt.ui.client.event.WindowEvent; 
    import com.extjs.gxt.ui.client.event.WindowListener; 
    import com.extjs.gxt.ui.client.store.ListStore; 
    import com.extjs.gxt.ui.client.widget.CheckBoxListView; 
    import com.extjs.gxt.ui.client.widget.Dialog; 
    import com.extjs.gxt.ui.client.widget.form.TriggerField; 
    import com.extjs.gxt.ui.client.widget.layout.FillLayout; 
    import com.google.gwt.user.client.Element; 

    public class MultiSelectComboBox extends TriggerField { 

     private Dialog checkBoxListHolder; 
     private CheckBoxListView listView; 
     private ListStore store; 

     private String delimiter = ","; 
     private boolean readOnly; 


     public MultiSelectComboBox() { 
      store = new ListStore(); 
      listView = new CheckBoxListView(); 
     } 




     @Override 
     protected void onTriggerClick(ComponentEvent ce) { 
      super.onTriggerClick(ce); 
      if(readOnly) { 
       return; 
      } 
      checkBoxListHolder.setSize(getWidth(), 200); 
      listView.setWidth(getWidth()); 
      checkBoxListHolder.setPosition(getAbsoluteLeft(), 
        getAbsoluteTop() + getHeight()); 
      if(checkBoxListHolder.isVisible()) { 
       checkBoxListHolder.hide(); 
      } 
      else { 
       checkBoxListHolder.show(); 
      } 
     } 




     @Override 
     protected void onRender(Element target, int index) { 
      super.onRender(target, index); 

      checkBoxListHolder = new Dialog(); 
      checkBoxListHolder.setClosable(false); 
      checkBoxListHolder.setHeaderVisible(false); 
      checkBoxListHolder.setFooter(false); 
      checkBoxListHolder.setFrame(false); 
      checkBoxListHolder.setResizable(false); 
      checkBoxListHolder.setAutoHide(false); 
      checkBoxListHolder.getButtonBar().setVisible(false); 
      checkBoxListHolder.setLayout(new FillLayout()); 
      checkBoxListHolder.add(listView); 
      listView.setStore(store); 

      checkBoxListHolder.addWindowListener(new WindowListener(){ 

       @Override 
       public void windowHide(WindowEvent we) { 
        setValue(parseCheckedValues(listView)); 
       } 

      }); 

     } 




     private String parseCheckedValues(CheckBoxListView checkBoxView) { 
      StringBuffer buf = new StringBuffer(); 
      if(checkBoxView != null) { 
       List selected = checkBoxView.getChecked(); 
       int index = 1, len = selected.size(); 
       for(D c : selected) { 
        buf.append(c.get(listView.getDisplayProperty())); 
        if(index getListView() { 
      return listView; 
     } 

     public void setListView(CheckBoxListView listView) { 
      this.listView = listView; 
     } 

     public ListStore getStore() { 
      return store; 
     } 

     public void setStore(ListStore store) { 
      this.store = store; 
     } 

     public String getDelimiter() { 
      return delimiter; 
     } 

     public void setDelimiter(String delimiter) { 
      this.delimiter = delimiter; 
     } 

     public boolean isReadOnly() { 
      return readOnly; 
     } 

     public void setReadOnly(boolean readOnly) { 
      this.readOnly = readOnly; 
     } 


    } 

Le code a été expliqué ici ... http://bhat86.blogspot.com/2012/02/gxt-comobobox-with-multi-select-feature.html

Merci!

+0

En utilisant le code ci-dessus, j'obtiens toutes les cases à cocher avec l'étiquette 0 jusqu'à l'étiquette 9 et toute la case non cochée. Maintenant, mon besoin est que je veux case à cocher avec "Label 2" doit être vérifiée et reste doit rester non cochée seulement. J'ai essayé différentes options comme rafraîchir checkboxlistview et repeindre le magasin. Je ne sais pas où je vais mal .. S'il vous plaît aider – Jayesh

+0

Après avoir créé le widget ci-dessus (disons MultiSelectComboBox mscb = new MultiSelectComboBox()), vous pouvez ajouter un getter pour listView et peut dire mscb.getListView(). SetChecked (yourModel, true). – sanbhat

0

Voir les exemples listview et advanced list view. Ils peuvent vous aider dans le développement de la combobox avec l'option multi-sélection

+0

XComboBox n'est pas un composant GXT; C'est un code source écrit en tant que plug-in de l'un des membres du forum, qui veut le distribuer sous licence GPL. Il ne vient pas avec GXT! – sanbhat