New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

DataTable: row is selected when clicking on inputSwitch inside a column #3310

Open
Kameecoding opened this Issue Feb 9, 2018 · 7 comments

Comments

Projects
None yet
3 participants
@Kameecoding
Copy link
Contributor

Kameecoding commented Feb 9, 2018

1) Environment

  • PrimeFaces version: 6.1.0
  • Does it work on the newest released PrimeFaces version? No Version? 6.1.0
  • Does it work on the newest sources in GitHub? No
  • Application server + version: Application Server independent
  • Affected browsers: browser independent

p:inputSwitch inside a p:dataTable with singleSelection mode

2) Expected behavior

Clicking any part of the switch should not changethe selection in the table only the switch itself.

3) Actual behavior

Clicking the label on the switch changes selection in the table, while clicking the handle part doesn't.
Demo gif here: https://i.imgur.com/MRbxpEr.gifv

4) Steps to reproduce

  1. Select row in the table
  2. Click on the label part of the input switch in another row

5) Sample XHTML

6) Sample bean

Sample here: Kameecoding/primefaces-test@c156d9a

7) Cause

In \src\main\resources\META-INF\resources\primefaces\datatable\datatable.js

onRowClick: function(event, rowElement, silent) {
    //Check if rowclick triggered this event not a clickable element in row content
    if($(event.target).is(this.rowSelectorForRowClick)) {

evaluates to true when clicking the label, because the event target is the span
and the selector: "td:not(.ui-column-unselectable),span:not(.ui-c)" does include it.

@Kameecoding

This comment has been minimized.

Copy link
Contributor

Kameecoding commented Feb 12, 2018

@tandraschko is there a way to get this fix into 6.2.0?

@tandraschko tandraschko changed the title p:inputSwitch behavior inside a dataTable row DataTable: row is selected when clicking on inputSwitch inside a column Feb 12, 2018

@tandraschko tandraschko added the defect label Feb 12, 2018

@tandraschko

This comment has been minimized.

Copy link
Member

tandraschko commented Feb 12, 2018

Maybe, actually it's already to late ;)

@kukel

This comment has been minimized.

Copy link

kukel commented Feb 13, 2018

Same happens for commandButtons iirc...

@tandraschko

This comment has been minimized.

Copy link
Member

tandraschko commented Feb 13, 2018

So we probably need a better/more global fix. We should target that with 6.3. So please investigate a little bit also check if components have the same problems.

@Kameecoding

This comment has been minimized.

Copy link
Contributor

Kameecoding commented Feb 14, 2018

well the Selector based on which the selection is triggered is only checking for a span with class ui-c

both using div and tagging these affected spans with ui-c class fixes this issue

A more general fix could be a check to see if the element is contained within a component element.

@Kameecoding

This comment has been minimized.

Copy link
Contributor

Kameecoding commented Mar 6, 2018

on a slightly related note, <img> and <pre> elements do not trigger row selection.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment