Gender Grid column with Link button

[velucsc22]

This is my grid rendering code, I want the same from outside of this class. Rendering should be generic for all grids. Can anyone help to fix this?

public class SavedListGrid extends Grid<SavedListsModel> {

private static final SavedListsModelProperties modelProps = GWT.create(SavedListsModelProperties.class);

private static ColumnConfig<SavedListsModel, String> name = new ColumnConfig<SavedListsModel, String>(modelProps.name(), 150, "Name");
private static ColumnConfig<SavedListsModel, String> description = new ColumnConfig<SavedListsModel, String>(modelProps.description(), 130, "Description");
private static ColumnConfig<SavedListsModel, String> priveleges = new ColumnConfig<SavedListsModel, String>(modelProps.priveleges(),70, "Priveleges");
private static ColumnConfig<SavedListsModel, String> createdBy = new ColumnConfig<SavedListsModel, String>(modelProps.createdBy(), 150, "Created By");
private static ColumnConfig<SavedListsModel, String> lastUpdated = new ColumnConfig<SavedListsModel, String>(modelProps.lastUpdated(), 100, "Last Updated");

private static ListStore<SavedListsModel> store;

final static String desc = "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed metus nibh, sodales a, porta at, vulputate eget, dui. Pellentesque ut nisl. Maecenas tortor turpis, interdum non, sodales non, iaculis ac, lacus. Vestibulum auctor, tortor quis iaculis malesuada, libero lectus bibendum purus, sit amet tincidunt quam turpis vel lacus. In pellentesque nisl non sem. Suspendisse nunc sem, pretium eget, cursus a, fringilla vel, urna.<br/><br/>Aliquam commodo ullamcorper erat. Nullam vel justo in neque porttitor laoreet. Aenean lacus dui, consequat eu, adipiscing eget, nonummy non, nisi. Morbi nunc est, dignissim non, ornare sed, luctus eu, massa. Vivamus eget quam. Vivamus tincidunt diam nec urna. Curabitur velit.";


final static IdentityValueProvider<SavedListsModel> identity = new IdentityValueProvider<SavedListsModel>();

final static RowExpander<SavedListsModel> expander = new RowExpander<SavedListsModel>(identity, new AbstractCell<SavedListsModel>() {

@Override
public void render(Context context, SavedListsModel value, SafeHtmlBuilder sb) {
sb.appendHtmlConstant("<p style='margin: 5px 5px 10px'><b>Company:</b>" + value.getDescription() + "</p>");
sb.appendHtmlConstant("<p style='margin: 5px 5px 10px'><b>Summary:</b> " + desc);
}
});

public SavedListGrid() {

super(generateData(), createColumnModel());

this.getView().setStripeRows(true);
this.getView().setColumnLines(true);
this.getView().setAutoExpandColumn(name);
this.setBorders(false);
this.setColumnReordering(true);


this.getView().setAutoExpandColumn(description);
this.setBorders(false);

expander.initPlugin(this);

renderNameColumn();
}

public static void renderNameColumn(){
name.setColumnTextClassName(CommonStyles.get().nowrap());
TextButtonCell button = new TextButtonCell();
button.addSelectHandler(new SelectHandler() {

public void onSelect(SelectEvent event) {
Context c = event.getContext();
int row = c.getIndex();
SavedListsModel p = store.get(row);
Info.display("Event", "The " + p.getName() + " was clicked.");
}
});
name.setCell(button);
}

private static ColumnModel<SavedListsModel> createColumnModel(){

List<ColumnConfig<SavedListsModel, ?>> columnConfigList = new ArrayList<ColumnConfig<SavedListsModel, ?>>();
columnConfigList.add(expander);
columnConfigList.add(name);
columnConfigList.add(description);
columnConfigList.add(priveleges);
columnConfigList.add(createdBy);
columnConfigList.add(lastUpdated);

return new ColumnModel<SavedListsModel>(columnConfigList);
}

private static ListStore<SavedListsModel> generateData(){

store = new ListStore<SavedListsModel>(modelProps.key());
store.add(new SavedListsModel("My List1","", "Private", "name1", "name1"));
store.add(new SavedListsModel("My List2","", "Private", "name2", "name2"));
store.add(new SavedListsModel("My List3","", "Private", "name3", "name3"));

return store;
}
}

[icfantv]

It's not really clear what you're asking.

Also, per the javadocs, you should check for a null value inside your render() override.

[velucsc22]

I need to apply render() to any grid. for an example: I have a grid1 and grid2.

I need to render grid1's first column values to hyperlink button type.

I should have generic code for rendering Grid column. If i pass grid1 object to the generic code, it should update the Grid column values to hyper link button.

Finally the generic code can be used for any grid to change its column. This is my requirement.

Can anyone suggest any approach to accomplish this task?

[icfantv]

I'm not sure anyone can suggest an approach without first understanding what you are trying to accomplish and I must admit, I'm still struggling on that front.

Are you talking about a custom cell renderer for a grid column? I.e., if i have a POJO, say Foo, and I want to have the column that renders the Foo object do so based on certain properties of the Foo object, how do I have my custom cell renderer render a clickable hyperlink for the text of my choosing (from the Foo object)?

[velucsc22]

If words are hard to understand, let me put it in simple.

Need to render a button in Grid columns, but the button should be in the form of link or hyperlink.

[icfantv]

So do you want a button or a hyperlink? They are different.

If you want a clickable hyperlink, you'll need to build a custom cell to do the rendering and select handling. It's not a lot of work, we've done it, but there is no existing GXT widget to do this. There are several GWT widgets you might be interested in, but they will also require some additional work to work correctly and they are either SafeHtmlCell or ClickableTextCell. We do not use them.

If you want a button, there's an existing GXT widget TextButtonCell you can use. You just instantiate an instance, add your select handler, and set it on your ColumnConfig.

Let me know if you need some help and I can provide some sample code if you get stuck.

[velucsc22]

Thanks in bunch for your help. I have implemented with TextButtonCell and it looks good. I am able to accomplish this code with button, but I want the same implementation with hyperlink, but the hyperlink is required to invoke some action which is similar to a call to method from the same class.

Please let me know if it make some sense and gives some idea what i actually required..

name.setColumnTextClassName(CommonStyles.get().nowrap());
TextButtonCell button = new TextButtonCell();
button.addSelectHandler(new SelectHandler() {

public void onSelect(SelectEvent event) {
Context c = event.getContext();
int row = c.getIndex();
CustomerModel p = store.get(row);
Info.display("Event", "The " + p.getName() + " was clicked.");
}
});
name.setCell(button);

[icfantv]

To get a hyperlink text cell, you need to have two things, 1) something that renders the text as a hyperlink (or in our case, something that LOOKS like a hyperlink but isn't really because we're in a web application there's no where to navigate in the traditional hyperlink sense), and 2) either a callback mechanism or a SelectHandler.

We went with the second because it allows for more than one handler to be added if need be. A good rule of thumb is that if it's a one off and will only be used once, use a callback but if it's a completely reusable widget, use a handler.

Note that our design such that ONLY the hyperlink has the pointer cursor and NOT the entire cell and we only care about the three events listed in the constructor, if you need more, you'll need to add them and add additional code in onBrowserEvent(...). Additionally, onBrowserEvent(...) could potentially be called a lot so you do not want any heavy logic in there.

Here's what we're doing:

public class AnchorTemplates
{
   public static final TextTemplates TEMPLATE = GWT.create(TextTemplates.class);

   public static interface TextTemplates extends XTemplates
   {
      @XTemplate("<a class='anchor' style='cursor: pointer;'>{anchorText}</a>")
      public SafeHtml anchor(String anchorText);
   }
}

public class ClickableAnchorCell extends ResizeCell<String> implements HasSelectHandlers
{
   public ClickableAnchorCell()
   {
      super("click", "mouseover", "mouseout");
   }

   @Override
   public HandlerRegistration addSelectHandler(SelectEvent.SelectHandler handler)
   {
      return addHandler(handler, SelectEvent.getType());
   }

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

   @Override
   public void render(Context context, String value, SafeHtmlBuilder sb)
   {
      if (value != null)
      {
         sb.append(AnchorTemplates.TEMPLATE.anchor(value));
      }
   }

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