Need to find the CheckBox status for CheckBox

[velucsc22]

Hi,

How to find the checkbox status for sencha gxt checkbox component? I have binded Checkbox to ListView and how do i get the checkbox status when i click ListView cell?

I am able to get the complete cell details in onSelect() of ListView, but i want only CheckBox status at this end.

[icfantv]

When you say "status" do you mean whether or not the checkbox is selected?

I'm assuming you mean that you have a ListView of items that contain a checkbox. If so, have you tried ListView.getSelectionModel().getSelectedItems()?

[velucsc22]

Thanks for the reply. Sorry for not posting the clear details in earlier message. Here are the details on what is required....

I want to create a multi select dropdown with Checkbox against each option in the dropdown. Since we don't have a direct Sencha GXT component of this type, i tried to derive this component by using Sench GXT ComboBox component (the closest i can choose). The example i picked for the same is the ComboBox component having XTemplate approach. Code for the same....

interface ComboBoxTemplates extends XTemplates {
@XTemplate("<img width=\"16\" height=\"11\" src=\"{imageUri}\"> {name}")
SafeHtml country(SafeUri imageUri, String name);

@XTemplate("<div qtip=\"{slogan}\" qtitle=\"State Slogan\">{name}</div>")
SafeHtml state(String slogan, String name);

}

I replaced @XTemplate with my own custome code like...
@XTemplate<"input type=\"checkbox\"...../>{name}

I was able to achive the whole UI and successful in capturing the event as this is the default functionality without issues. We were successfull in select/unselect multiple options from dropdown without issues. If we click anywhere other than checkbox we were unable to update the checkbox status eg. clicking on option name or white space after name we were successful in getting the selected/unselected value but unable to update Checkbox getting checked/unchecked with select/unselect option respectively.

Kindly suggest changes required in our approach if required. Thanks

[icfantv]

May I assume that you are using a custom cell to render the contents of your XTemplates?

Here's what we've done - note that TEMPLATE.anchor(...) is an XTemplate that returns a SafeHtml that renders text to behave like a hyperlink:

public abstract class AbstractBaseClickableCell<C> extends ResizeCell<C> implements SelectEvent.HasSelectHandlers
{
   @Override
   public HandlerRegistration addSelectHandler(SelectEvent.SelectHandler handler)
   {
      return addHandler(handler, SelectEvent.getType());
   }

   @Override
   public void onBrowserEvent(Context context, Element parent, C value, NativeEvent event, ValueUpdater<C> valueUpdater)
   {
      if (!isDisableEvents())
      {
         String eventType = event.getType();
         if ("click".equals(eventType))
         {
            XElement target = event.getEventTarget().cast();
            if (target.hasClassName("anchor"))
            {
               this.onClick(context);
            }
         }
      }
   }

   protected abstract void onClick(Context context);

   protected AbstractBaseClickableCell()
   {
      super("click", "mouseover", "mouseout");
   }
}

public final class ClickableAnchorCell extends AbstractBaseClickableCell<String>
{
   @Override
   public void render(Context context, String value, SafeHtmlBuilder sb)
   {
      if (value != null)
      {
         sb.append(AnchorTemplates.TEMPLATE.anchor(AnchorCss.ANCHOR_CSS.anchor(), value));
      }
   }

   protected void onClick(Context context)
   {
      if (!isDisableEvents() && fireCancellableEvent(context, new BeforeSelectEvent(context)))
      {
         fireEvent(context, new SelectEvent(context));
      }
   }
}

The magic happens in onBrowserEvent(...) where we check to see if a click event has happened, and if so, we also take the extra step to make sure the user actually clicked on our anchor DOM element (that's the hasClassName bit) but I don't believe you actually need this since it sounds like you want to [de]select the checkbox when the user selects anywhere in the cell.

You should know, however, that ListView.getSelectionModel().getSelectedItem() has no bearing on the cell, you would need to manage the state of the checkbox and ensure that the cell is selected so that the above returns the list of selected items.

Play around with this and please let me know how it goes.