Announcement

**Isomorphic** · 1 Oct 2015, 14:22

We're not familiar with this issue from your description.
Can you show us a simple test case we can run to reproduce the problem. Ideally a small EntryPoint class which defines a simple UI [a ListGrid with appropriate fields and data hardcoded in, perhaps], which we can run unmodified in a test project.

Thanks
Isomorphic Software

**stonebranch2** · 1 Oct 2015, 18:17

I changed the HTML generated by the cell formatter to not use <a href..>, and the problem went away. So it is definitely related to that.

Here is some additional information.

1) If no rows are currently selected in the listgrid, and I right-click the formatted cell "link" from row 0, the RowContextClickEvent fires, but has no record and no row num information.
2) If row 1 is selected in the listgrid, and I right-click the formatted cell "link" from row 0, the RowContextClickEvent fires, but includes row 1 information, not row 0 information. In order words, the event contains the row information from the previously selected row.

I will see about a sample.

**stonebranch2** · 1 Oct 2015, 19:32

OK, I have put a sample together, it isn't quite the problem I was talking about, but it is one of the behaviours I am dealing with that has brought me here.

If you load the demo below, and ...

...right-click on the "whitespace" of the "name" cell of any row, it will mark that row selected.
...right-click on the formatted cell "link" of the "name" cell of any row, and it will not mark the row selected.

Is there a way I can make the right-click always mark the row selected regardless of where in the cell I right-click?

Thanks

Code:

public class Sandbox5 implements EntryPoint {

    @Override
    public void onModuleLoad() {
        ListGrid lg = new ListGrid();
        lg.setWidth100();
        lg.setHeight100();
        lg.setShowRollOver(Boolean.FALSE);
        lg.addCellContextClickHandler(new CellContextClickHandler() {

            @Override
            public void onCellContextClick(CellContextClickEvent event) {
                event.cancel();
            }
        });
        ListGridField lgf1 = new ListGridField("name");
        lgf1.setEscapeHTML(Boolean.FALSE);
        lgf1.setCellFormatter(new CellFormatter() {
            @Override
            public String format(Object value, ListGridRecord record, int rowNum, int colNum) {
                StringBuilder builder = new StringBuilder();
                builder.append("<a href=\"#\" style=\"color:#000000;\" onclick=\"alert('placeholder');return false;\">");
                builder.append(value);
                builder.append("</a>");
                return builder.toString();
            }
        });
        ListGridField lgf2 = new ListGridField("value");
        lg.setDefaultFields(lgf1, lgf2);
        Record r1 = new Record();
        r1.setAttribute("name", "Name1");
        r1.setAttribute("value", "Value1");
        Record r2 = new Record();
        r2.setAttribute("name", "Name2");
        r2.setAttribute("value", "Value2");
        Record[] rl = new Record[] { r1, r2 };
        lg.setData(rl);
        lg.show();
    }
}

**stonebranch2** · 5 Oct 2015, 05:45

Hello Isomorphic,
Any chance you have an update on this yet? Being able to make right-click behave consistently, that is mark the row selected, regardless of where in the cell we right-click (whitespace or formatted cell "link") would probably be enough for me. However, if there is no way to do this, then I have to proceed with my workaround, which currently does not work on IE, and I will move forward with demonstrating that issue with a new sample.
Thanks

**Isomorphic** · 5 Oct 2015, 09:12

We took a look and see the behavior. We're considering whether / how best to react to this.

One fundamental question which is worth raising is - what are you actually trying to achieve in terms of user experience?
Clearly you want a "link" in the cell - beyond that:
- what's the behavior you want on left-click over the link? [browser navigation? execute some JS? something else]
- what's the behavior you want on right-click over the link? Standard browser context menu for links? Custom context menu? List-grid level context menu? Custom JS executed via cellContextClick type handler? None of the above and just select as would normally happen with a left click elsewhere on the grid?

It might also be helpful to have a high level description of what sort of information this grid contains / how these links are being used in the app.

This background should help us come up with the best way to achieve your desired user-interface and also give us a clearer picture of the use case, so we can decide whether it indicates a hole in the framework and warrants a change there.

Thanks
Isomorphic Software

**stonebranch2** · 5 Oct 2015, 10:20

Hi Isomorphic,

Before I continue, I will point out that we do have a workaround that works on both FF and Chrome, but not IE, and I will elaborate below as I attempt to answer your questions. It might make sense to initially tackle the inconsistent behaviour with IE, so I will provide all the details.

isomorphic what's the behavior you want on left-click over the link? [browser navigation? execute some JS? something else]

stonebranch We would not want any change to the current behaviour when left-clicking the link or anywhere in the formatted cell for that matter. The current behaviour works as we desire. That is, when left-clicking the "link" in the cell, custom JavaScript is executed, when left-clicking outside of the link, but still within the same cell, it would be treated just like clicking anywhere else in the row. If there were any behaviour changes with left-click, it would break our flow.

isomorphic what's the behavior you want on right-click over the link? Standard browser context menu for links? Custom context menu? List-grid level context menu? Custom JS executed via cellContextClick type handler? None of the above and just select as would normally happen with a left click elsewhere on the grid?

stonebranch We display a custom context menu for the row using a RowContextClickHandler. Since we deal with the custom context menu ourselves, in essence, we would want "None of the above and just select as would normally happen with a RIGHT-click (not left-click!) elsewhere on the grid. I am not sure if your comment above meant to say "left-click", but I wanted to be explicit here that we would definitely not want the left-click behaviour.

At the moment, to work around this, we added the following workaround...

Code:

          addRowContextClickHandler(new RowContextClickHandler() {
              @Override
              public void onRowContextClick(RowContextClickEvent event) {
                  // Prevent default browser context menu.
                  event.cancel();
                  ...
                  [B]
                  if (SharedUtils.toBooleanPrimitive(field.getAttribute("REFERENCE_LINK_ATTR"))) {
                      // Ensure when right-clicking "link" formatted cell, the record is selected.
                      Record r = event.getRecord();
                      if ((r == null) || !((r instanceof ListGridRecord))) {
                          SC.logWarn("onRowContextClick: unable to determine which record to select and/or confirm already selected");
                          return;
                      } else if (!isSelected((ListGridRecord) r)) {
                          selectSingleRecord(r);
                      }
                  }
                  [/B]
                  ...
                  <some customization of context menu based on currently selected row>
                  ...
                  contextMenu.showContextMenu();
              }
          });

This actually works perfectly on FF and Chrome. When a user right-clicks on the "link", the RowContextClickEvent fires, and we confirm that the row is marked as selected (using the record from the event) and then show the customized context menu. Note, it will only go into the REFERENCE_LINK_ATTR=true block if the user right-clicks on a "link" cell.

This basically forces the right-click on the link to behave like any other right-click event, except of course, in IE.

In IE, there are a couple of inconsistent behaviours compared to FF and Chrome.

It would appear that right-clicking the "link" doesn't even fire a RowContextClickEvent event in IE. I have also seen the RowContextClickEvent fire with inaccurate event information, where (event.getRecord()==null) or event.getRecord() returns a record inconsistent with the record just right-clicked, almost like it is the previously selected or currently selected record, etc.

If you can fix these inconsistencies in IE, then our problem would likely be resolved without any further changes.

It might make sense to start here to address why IE is functioning differently than FF and Chrome.

Thanks

**Isomorphic** · 6 Oct 2015, 09:13

Thanks - I think that's clear. We'll investigate and respond when we have more information for you.

**Isomorphic** · 6 Oct 2015, 10:14

Actually - let's start by getting you a workaround.

The problem here is that SmartClient has logic in place to 'get out of the way' of standard browser event handling over elements with natively meaningful behavior, like links.
This is usually desirable - it avoids application logic inappropriately firing in response to attempted user interaction with natively interactive HTML elements embedded in widgets - but in this case the behavior is not what you want.
We're taking a look at why this is behaving inconsistently in I.E. in this case, and whether we should consider any framework changes to make this case be handled better -- but for now the easiest thing is to modify your application's cell value.

Instead of using true links, you can simply embed a DIV into your cell with appropriate styling and its own onclick handler.
Something like this:

Code:

"<div style='text-decoration:underline;cursor:pointer;' onclick='someMethod()'>Link Value</div>"

This will give you the behaviour you want - the user can click on the "link" and behavior will execute which doesn't occur elsewhere in the cell - but it will also simply avoid this confusion where some built-in framework handling is suppressed.
Obviously you can tweak the CSS as makes sense to you, and the style could be applied from a defined css class rather than inline if that works better for you.

Please let us know if this will work for you.

Meantime we will also look at how true embedded true link elements are handled and consider whether any framework changes make sense here - but this workaround should hopefully make the point moot for your particular case.

Regards
Isomorphic Software

**stonebranch2** · 6 Oct 2015, 10:20

Hi Isomorphic,

I appreciate the recommendation of a workaround, however, I did already investigate this approach and I ran into a hurdle that I could not resolve.

If I recall correctly, clicking the link started behaving like a regular left-click on the row, so yes, it performed the onclick logic perfectly, however, it also resulted in left-click behaviour too, which is not what we desire here.

Do you have a workaround for this hurdle? If so, I can experiment with that.

Thanks

**Isomorphic** · 6 Oct 2015, 12:34

Hmm - you want sort of partial "native link" behavior - some SmartClient behavior allowed to proceed (select on right-mouse), some suppressed.

2 approaches come to mind.
One option would be to continue with the html "pseudo link" approach suggested above but add an 'onmousedown' handler which sets an attribute on the grid (like "suppressEvents"). and an 'onmouseup' handler which clears it. You can then check these attributes on the grid from your cellMouseDown / cellClick etc handlers and return false to suppress standard grid behavior.
You'd use javascript to set the attribute (probably easiest to set an ID on the grid and then access it in JS via window[<specifiedID>]) - and then getAttribute() would allow you to get at the property from your Java code.

Another option would be to use RecordComponents to embed a component which displays link-styled text and has handlers for mouse events applied using the standard SmartGWT pattern.
This is the less "low-level" option - it doesn't require any direct JavaScript coding, but you should be aware that it's easy to leak memory with RecordComponents - make sure you understand the "recordComponentPoolingMode" stuff before going down this route.

Regards
Isomorphic Software

**stonebranch2** · 6 Oct 2015, 12:45

Hi Isomorphic,
We can keep those concepts in mind, however, given that our current workaround is quite straightforward, and is functioning perfectly in FF and Chrome, we would like to get to the bottom of why the framework behaves so differently in Internet Explorer compared to the other browsers. We would really appreciate a fix here.
Thank you

**Isomorphic** · 6 Oct 2015, 14:10

We've determined what was special about IE. There was a rather obscure framework bug here which this particular setup happened to hit. That issue is resolved, so pick up the next nightly build on the 10.1d branch (Oct 7 or above) to get the fix.

If we do make changes to how the framework behaves with respect to your implementation here we'll update the thread to keep you informed.

Regards
Isomorphic Software

**stonebranch2** · 7 Oct 2015, 05:01

Thank you for looking into this, your fix is much appreciated. I will pick up the build and verify as soon as available.
Regards

**stonebranch2** · 7 Oct 2015, 12:46

Hi Isomorphic,

It is looking much better now, however, I think there might still be an issue lurking here.

If I right-click on a "link" in row 1, then right-click on a "link" in row 2, etc., it appears the RowContextClickEvent sometimes stops firing.

Interestingly, if I leave the tab that is displaying that list grid and go to another tab, then come back to the tab displaying the list grid, the right-click starts working again.

Regards

Announcement

RowContextClickHandler.onRowContextClick(...) no Record or RowNum in IE

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment