I need to put an HTML code on dragging event. Like there is some HTML text that gets dragged with Cursor.
By default first column of ListGrid goes with Cursor. But I want to generate separate Text for it.
So, is it possible to do that?
Or Is there any other option to do that?
Please help me in this.
Thanks.
Whats displayed (by default) during a drag event in ListGrid is defined by ListGrid.dragTrackerMode and ListGrid.titleField.
ListGrid will default to first field to obtain the description to be shown during a drag, based on titleField.
If you already have another field in the grid from which you can obtain the text, use listGrid.setTitleField("other-field-name");
A custom title can be defined by overriding ListGrid.getDragTrackerTitle
If multiple records are selected, and dragged, drag tracker/title/etc. will be based on first selected record.
Check other ListGrid methods that allow drag tracker customizations as well.
Related
Got a bug in tree table on scroll selected check box position changed
Before scroll
After Scroll Down
In Tree table, once the HTML is render it will not changed. If you have observe, after table scroll also the generated HTML ID's by UI5 will be same.
So you need to use two way data binding model with a property bind to the checkbox, which will tell the checkbox status ie checked/unchecked.
Means backend data should have a property which is bind to the checkbox selected property, so that when ever you select the checkbox the corresponding property will be changed (true/false) and on scrolling also the it will maintain the selected property.
I want to remove a style from a previously selected row of a gwt DataGrid when clicked on a new row.
Im able to do it by redrawing the grid, is it possible to do it without redrawing the grid.
You can do that with gwtquery, just capture the event and use gquery to select the element in the dom you want to modify using css3 selectors.
If you put some code with the place where you want to capture the action, and the dom structure of your grid, I could help with the snippet.
I have a sortable column in a CellTable. The problem is that I have a custom Header, in the header there is a text box. When the user clicks the text box, the column is sorted and the text box looses focus. What I need is for the sort to happen if there is a click anywhere in the header except in the text box. I have tried listening to the "click" event on the textbox cell and do stopPropagation, but the event is fired after the sort happens so it does not stop the event. Any ideas would be helpful.
Cell widgets use event delegation: the event that triggers and gets passed to your Cell's onBrowserEvent is the same, caught at the same place, as the one that triggers sorting, so stopPropagation won't be of any help.
Also, have a look at the code for CellTable (or AbstractCellTable in trunk): there's no way to prevent sorting. I'd suggest you file a request for enhancement on the issue tracker.
I have a CellTable with a bunch of cells that render to <input> tags. Tabbing between the inputs is broken because of CellTable's fancy event processing. It seems that tab inspires each cell to finishEditing, but that in turn hogs the focus and the focus never gets to the next <input>.
Setting tabIndex on each input does not seem to affect the behavior.
How can I restore the usual tabbing functionality?
I recently figured this out. Annoying, but simple once you find the magic.
Create a new Cell type to use in your table, as the stock TextInputCell specifies a tab index of -1. Basically do everything that TextInputCell does, but dont specify any tab index in your template.
Disable the default keyboard navigation on your CellTable. cellTable.setKeyboardSelectionPolicy(KeyboardSelectionPolicy.DISABLED)
This should result in a normal tab navigation in your CellTable.
Disabling KeyboardSelectionPolicy may not work on all views, if you are using any MVP frameworks. GWT selects the cell instead of the input field within the cell.
Here is a solution which I used in my applications: Adding TAB control to GWT CellTable
the solution from Ben Imp works fine if you dont change the value of the cell, but if you change the value and try to navigate with tab to the next cell it lost focus and starts with the first element of the view. I have not found a solution for this inappropriate behaviour.
For those looking at this in the future trying to figure out how to have tabbing while changing values, do what the Ben Imp suggests then also in your custom components remove any reference to super.finishEditing. In some cases this means overriding finishEditing and having it do nothing.
I have a cellTable with 5-6 columns. I want to put a plus icon in each row on clicking of which will display the details maybe in a disclosure panel. I have been looking around for a while now and I cannot find any information on how to achieve this. Could someone point me in the right direction?
i suspect i probably have to add a cellTree to the column? how do i go about this?
Thank you for your response in advance.
There is work in progress to allow expandable rows in CellTable among other features (maybe GWT 2.3). You can see more details here:
http://groups.google.com/group/google-web-toolkit-contributors/browse_thread/thread/b4a8a6e3c98ac061#
If that is not enough or you can not wait untill it is released I can think of two ways to achieve it:
As you said, using a CellTree.
Creating a custom cell that stores
state (open/close). Depending on the
state the cell will render
differently. In same way it is
similar to how EditTextCell works, in
"edit" state it renders an input
field while in "normal" state it renders
simple text.
I'm trying to do that too ... I managed to mimic that functionality toying with the html and a custom cell class that allows clickable pictures.
It is working for normal content such as text but if you'd like to get an asynchronous data to show in the expended line, I don't know how to do it ... (I'm trying to do exactly that).
Also, it doesn't look good because the columns don't align well ...
So what I've done is:
- create a custom cell class to display a picture (right pointing triangle, looking like the triangle in the disclosure panel)
In the click event get the HTML code of the selected row and copy it. Replace the content of the row (all cells) in the table with only one cell with its colspan set to number of columns. In the cell, add a table with first line the copied row and second line the content to display as expanded.
Get the image to sink an event for closing. In event, reset the original row that we copied.
I hope it helps.