Double click on datatable with multiple selections

[venkideshmukh]

Hi,
my requirement is as follows:
I have Datatable which display employee list (Lazydatamodel). I want to show edit screen in popup when user double clicks on any row. Also, it should be possible that user can select multiple employees using checkboxes (for deleting employees)

Problem is that, multiple selection and doubleclick listener are not supported at a time. I can either have multiple selections enabled for deleting users or single only one employee at a time in case of dblClick..

Does primefaces support selecting the record using checkboxes as well as double click at a time ?

[val3rian]

Hi,

I need same feature, any suggestions?

[siva]

On double click any row in my datatable i want to display popup or browser window please help me on this

[T.Rollinger]

Need that feature as well, is there a solution out there?
dblClickSelect="true" doesn't help either.

[T.Rollinger]

Need that feature as well, is there a solution out there?
dblClickSelect="true" doesn't help either.

After a long research period I'm now forced to solve this problem by a customer requirement.
Here is my workaround.

• First I apply via jQuery a dblClick event to every row (pay attention that in every td is a div, don't ask me why)

  Code: Select all

  $(document).ready(function() {
  	$("tbody[id$='myForm\\:tabs\\:table_data'] > tr").dblclick(function(){
  		showSinglePosting([{name: 'row', value: $(this).find("td").eq(1).find("div").text()}]);
  	});
  	});
  

  Second I put a remoteCommand into my JSF page

  Code: Select all

  <p:remoteCommand name="showSinglePosting" update="@form"  actionListener="#{table.doubleClickSelection}"/>

  Third and finally I get the submitted parameter "row" from the FacesContext

  Code: Select all

      public void doubleClickSelection() throws MyException
      {
          FacesContext context = FacesContext.getCurrentInstance();
          Map<String, String> map = context.getExternalContext().getRequestParameterMap();
          String zeile = map.get( "row" );
  
          if ( !StringUtils.isEmpty( row ) )
          {
            // Here are things done with "row"
          }
      }
  

This is a workaround because I'm finally not satisfied with it.
But it works!

[kukeltje]

After a long research period I'm now forced to solve this problem by a customer requirement.
This is a workaround because I'm finally not satisfied with it.

Why is it a workaround? It is a perfectly normal way to extend things.

And dblclick in combination with maintaining multiple selection is very, very uncommon (so I think it is strange that a customer has this explicit requirement). Something like this will not get into primefaces I think, unless a primefaces-pro user has this requirement.

[T.Rollinger]

After a long research period I'm now forced to solve this problem by a customer requirement.
This is a workaround because I'm finally not satisfied with it.

Why is it a workaround? It is a perfectly normal way to extend things.

And dblclick in combination with maintaining multiple selection is very, very uncommon (so I think it is strange that a customer has this explicit requirement). Something like this will not get into primefaces I think, unless a primefaces-pro user has this requirement.

Sure, but if I maintain multiple selection as a column with checkbox it isn't furthermore possible to implement it out-of-the-box easily via p:ajax with event="rowDblselect".
And you have no idea what a customer wants to have.
He wants the possibilty to edit the row data via double click and after saving coming back to the datatable view but the multiple selection has still to be maintained.
And that is nothing special if you keep in mind that you have to transfer a rich client app into a web app!

And as far as I can see I'm not the only one with this requirement!

[kukeltje]

Sure, but if I maintain multiple selection as a column with checkbox it isn't furthermore possible to implement it out-of-the-box easily via p:ajax with event="rowDblselect".

Personally I do not like the way the events are named and used in the datatable, but that is unfortunately what it is...

And you have no idea what a customer wants to have.

Your customer no, but for many others I do

He wants the possibilty to edit the row data via double click and after saving coming back to the datatable view but the multiple selection has still to be maintained.

That is doable, but it takes some programming. But it would be easier to implement if the events in the datatable change...

And that is nothing special if you keep in mind that you have to transfer a rich client app into a web app!

Customers should get used that Webapps (even rich ones) never ever will have identical functionality. And funny enough, they often do if you tell them the price difference

And as far as I can see I'm not the only one with this requirement!

No, the second one from the 13136 subscribed users in this forum (not counting the thousands of others that do not have an account)

[T.Rollinger]

Just for the record,
I had trouble with sorting and afterwards double-clicking because it stopped to work after sorting of the table.
I simply wrapped the jQuery-call in JS function and called that from the document ready state:

Code: Select all

	function initRows(){
	    $("tbody[id$='centerForm\\:tabs\\:table_data'] > tr").dblclick(function(){
	        showSinglePosting([{name: 'row', value: $(this).find("td").eq(1).find("div").text()}]);
	    });
	}

	$(document).ready(function() {
	    initRows();
	});

On the table I added the sort event and oncomplete I trigger the initRow()-Method because of a rerendering:

Code: Select all

<p:ajax event="sort" oncomplete="initRows()"/>

UPDATE:
For pagination I added

Code: Select all

<p:ajax event="page" oncomplete="initRows()"/>