Close picklist of select item smartgwt - gwt

I have the following requirement.
There is a select item which has a pickList which is a ListGrid with check boxes for multiple selection.
Once the user selects the records then user has to manually click on the picklisticon (down arrow just beside (right) to the select item) or he can click anywhere out side of the select item to close the pickList.
Now i want to close this pickList when the mouse moves out of the listGrid (pickList) after user selects the records he wants to.
This is because ,after selecting the records there is a button which user clicks to save the form. With Picklist being closed only when he manually clicks the down arrow or anywhere outside of the select item and then click on the apply button.
Is there any way i can achieve this functionality?
Following is the code
VLayout layout = new VLayout();
final ButtonItem button = new ButtonItem("button","Apply");
button.addClickHandler(new ClickHandler() {
#Override
public void onClick(ClickEvent event) {
SC.say("You clicked me");
}
});
final ListGrid pickListProperties = new ListGrid();
pickListProperties.setShowHeader(true);
pickListProperties.setCanGroupBy(false);
pickListProperties.setAutoFetchData(true);
pickListProperties.addMouseOutHandler(new MouseOutHandler() {
#Override
public void onMouseOut(MouseOutEvent event) {
GWT.log("Closing the pick list of the select item");
pickListProperties.hide(); // Not sure how to get the arrow down item and fire the click event on this so that pickList is closed.
button.focusInItem();
}
});
ListGridField descrField = new ListGridField("description","Names");
DataSourceTextField dsField = new DataSourceTextField("description","Names");
dsField.setMultiple(true);
DataSource optionalDS = new DataSource();
optionalDS.setDataURL(GWT.getModuleBaseForStaticFiles()+"optional.xml");
optionalDS.setFields(dsField);
final SelectItem selectItem = new SelectItem("Name","Select");
selectItem.setPickListHeight(100);
selectItem.setSelectOnFocus(true);
selectItem.setPickListFields(descrField);
selectItem.setPickListProperties(pickListProperties);
selectItem.setPickListWidth(350);
selectItem.setOptionDataSource(optionalDS);
selectItem.setMultiple(true);
selectItem.setAllowEmptyValue(false);
selectItem.setMultipleAppearance(MultipleAppearance.PICKLIST);
// selectItem.sett trigger
DynamicForm hdf = new DynamicForm();
hdf.setFields(selectItem,button);
layout.addMember(hdf);

Related

How to get current row (element) on TreeEditor Button click event

TreeViewerColumn colEdit= new TreeViewerColumn (viewer, column);
colEdit.setLabelProvider(new ColumnLabelProvider(){
#Override
public void update(ViewerCell cell) {
TreeItem item = (TreeItem) cell.getItem();
Button btnEdit= new Button((Composite) cell.getViewerRow().getControl(),SWT.NONE);
btnEdit.setText("Edit");
TreeEditor editor = new TreeEditor(item.getParent());
editor.grabHorizontal = true;
editor.grabVertical = true;
editor.setEditor(btnEdit, item, cell.getColumnIndex());
editor.layout();
btnEdit.addSelectionListener(new SelectionAdapter() {
#Override
public void widgetSelected(SelectionEvent e) {
// How to get current row element.
TreeItem[] selection = treeViewer.getTree().getSelection(); // (Selection is empty, because click on button and selection not happened)
}
});
}
});
treeViewer.getTree().getSelection(); return empty because Tree Editor with button control added and while button click row selection not happening.
cell.getElement() returning null in handler method.
btnEdit.setData can help me but Is there any way to get current row (element) on which button click event it clicked ??

I want to add a button in a paging grid column and register a separate event for the button.Gwt

I'm having a paging grid in which i have a column of buttons. Can i add a separate button click handler apart from the row click handler?
I'm using this code, but its not working
ColumnConfig<Stock, String> buttonCol = new ColumnConfig<Stock, String>(
props.button(), 100, "Button");
TextButtonCell edit=new TextButtonCell();
edit.setText("Edit");
buttonCol.setCell(edit);
edit.addSelectHandler(new SelectHandler() {
#Override
public void onSelect(SelectEvent event) {
Window w=new Window();
w.setHeadingText("Test Popup");
VerticalPanel vp12345=new VerticalPanel();
vp12345.add(new TextField());
vp12345.add(new Button("transfer"));
vp12345.add(new Button("Exit"));
w.add(vp12345);
w.show();
}
});

GXT3 - Editable Grid: display the row to edit in a popup

GXT3 - Grid: Adding a column with a button to modify row in Editable Grid
In the example the line is editable automatically when line is selected.
http://www.sencha.com/examples/#Exam...oweditablegrid
I want the line to be changed when I click on the edit button that would appear in a popup.
TextButtonCell button = new TextButtonCell();
button.addSelectHandler(new SelectHandler() {
#Override
public void onSelect(SelectEvent event) {
Context c = event.getContext();
Info.display("Event", "Call the popup here.");
}
});
nameColumn.setCell(button);
There is a way do get this?
Thanks in advance for your help.
First of all you have yo create a column with TextBoxCell which may you already created.
Then you have to disable default onclick editable behavior of grid.
For that as per Sencha example's file RowEditingGridExample.java you can override onClick event and prevent to fire default code.
public class RowEditingGridExample extends AbstractGridEditingExample {
#Override
protected GridEditing<Plant> createGridEditing(Grid<Plant> editableGrid) {
return new GridRowEditing<Plant>(editableGrid){
#Override
protected void onClick(ClickEvent event) {
}
};
}
}
And when you click on textBoxCell click handler you can start editing manually.
TextButtonCell button = new TextButtonCell();
button.addSelectHandler(new SelectHandler() {
#Override
public void onSelect(SelectEvent event) {
Context c = event.getContext();
//Here you can pass a new GridCell like with proper cell index and row index.
GridCell cell = new GridCell(getRowIndex(), getCellIndex());
editing.startEditng(cell);
}
});
nameColumn.setCell(button);
If you want to appear row editor in separate popup you have to design it manually.

GWT - implement ClickHandler event on a row of a FlexTable

So my software is displaying a flextable (the data is grabbed and displayed from a database) with users allowing to click on a checkbox to select a data.
//users is the flextable object.
userCheck = new ClickHandler() {
public void onClick(ClickEvent event) {
CheckBox src = (CheckBox) event.getSource();
for (int i = 1, n = users.getRowCount(); i < n; i++) {
CheckBox box = (CheckBox) users.getWidget(i, 0);
if (!box.equals(src)) {
box.setValue(false, false);
}
}
removeUserButton.setEnabled(src.getValue());
editUserButton.setEnabled(src.getValue());
}
};
The code above works, but now I'm trying to implement an action where instead of the user clicking on the checkbox, I want the user to click on a row (which ever cell of the table) and make the whole row (where the user have selected) to be highlighted. So I implemented this code below but so far it doesn't work (like the mouseclick won't register, I've yet to implement the color stuff yet.. :( ). Any suggestions?
userRowCheck = new ClickHandler() {
public void onClick(ClickEvent event) {
Cell src = users.getCellForEvent(event);
int rowIndex = src.getRowIndex();
System.out.println("Cell Selected: userRowCheck Handler, rowIndex: " + rowIndex);
//This is just to check if this method is even called out. And well, it doesn't.
}
};
Thanks very much!!!!
If you added userRowCheck to the FlexTable : myFlexTable.addClickHandler(userRowCheck); it should work. Just make sure you test src for null, because if you didn't put a widget in a cell and the user clicks on that cell it returns null.

gwt click event document

i need to register a cross platform and version independent click event to the document.
that means i have a two text box and submit button but when i click outside of the two text box and submit button then
alert will be displayed .how can i achive this by gwt
document.get().addMouseClick ???
The easiest way that comes to mind is to wrap everything in a FocusPanel:
ClickHandler clickHandler = new ClickHandler() {
#Override
public void onClick(ClickEvent event) {
Window.alert("TextBox/Button clickHandler.");
event.stopPropagation(); // The important line - We stop the event
// propagation here so that the FocusPanel
// doesn't get the event
}
};
TextBox textBox = new TextBox();
textBox.addClickHandler(clickHandler);
Button button = new Button("Test");
button.addClickHandler(clickHandler);
// Since FocusPanel is a SimplePanel, it can only have one child, so we are
// wrapping everything additionally in a HorizontalPanel
HorizontalPanel hPanel = new HorizontalPanel();
hPanel.add(textBox);
hPanel.add(button);
FocusPanel focusPanel = new FocusPanel(hPanel);
focusPanel.addClickHandler(new ClickHandler() {
#Override
public void onClick(ClickEvent event) {
Window.alert("Outside."); // Clicked outside of the TextBox/Button
}
});
RootPanel.get().add(focusPanel);
The downside is that you need to assign ClickHandlers to every element you don't want an alert for (you can use the same ClickHandler for that to save memory - like I did above). Other than that, the FocusPanel implementation should ensure that the onclick behavior stays cross-browser.