Put <select> element in grid cell?

skalkin commented 10 years ago

Hi, I am trying to use a cell formatter that lets user select a value from a list of choices (I am using a formatter instead of the editor so that the cells look like a select control). It is very simple and it gets the job done, but there is a glitch - whenever I click on the select element, the drop-down part shows and then closes momentarily; I am able to select new values, however, by pressing the mouse button, moving the cursor to the value (popup doesn’t close until mouse up), and releasing it there.

It looks like select’s behavior interferes with the way grid handles events - any ideas on how to fix it? Also, what do you think about that approach of making a formatter essentially do editor's job, do you see any issues with that?

Thanks! Here is my formatter's code for reference (mofidied from e02_formatters):

class Formatter extends fm.Formatter {
  @override
  void call(dom.HtmlElement target, int row, int cell, dynamic value, Column columnDef, DataItem dataContext) {
    target.children.clear();
    target.children.add(new dom.SelectElement()..setInnerHtml("<option>A</option><option>B</option>"));
  }
}

zoechi commented 10 years ago

I'll have a look. A suspicion is that the grid listens for all click events. Maybe you need to listen to the bwuClick event and call preventDefault when the select was clicked. I don't think rendering an edit control by default is a problem if you don't mind the dropdown-button to be always visible. Did you have a look at the auto-edit option? http://bwu-dart.github.io/bwu_datagrid/example/e03_editing.html (Auto-edit ON button on the right panel)

zoechi commented 9 years ago

Were you able to able to solve the problem? Can I close the issue?

skalkin commented 9 years ago

Hi, thanks for your help. I tried listening to the bwuClick event and calling preventDefault, but it looks like at this point the select's drop-down part is closed already; any ideas on what would the general approach be for debugging such issues?

I have also taken a look at the auto-edit option, but I have had mixed success using it - the editor still only appears after I double-click on the cell. I am looking further into that. Both autoEdit and editable options are set.

zoechi commented 8 years ago

Sorry for not responding. I tried to get back to work on the grid but didn't work out as expected. Is this still an issue?

skalkin commented 8 years ago

Hi, this is not an issue anymore. Thanks for getting back to me!

zoechi commented 8 years ago

Glad to hear! Btw, currently I'm working on porting the Grid to Polymer 1.0. Most examples are working fine already. There isn't too much to change. Most things are related to styling because /deep/ is deprecated and Polymer introduced new ways to apply styles and themes. I hope to be able to publish a pre-release soon.

bwu-dart / bwu_datagrid

Put <select> element in grid cell? #103