Re: jquery DataTable + wicket Cannot bind a listener

2014-10-28 Thread Martin Grigorov
Hi,

You should read about JavaScript event delegation. This is what they
recommend.

Wicket has basic support for this
with org.apache.wicket.ajax.attributes.AjaxRequestAttributes#setChildSelector.
I.e. you can register an Ajax behavior on the table or tbody and use
childSelector to listen for events only on specific children, e.g. 'tr',
'td', 'td div', etc.

This is more lightweight than using Wicket's built-in AjaxLink, but it is
also a bit more complex for you as an application developer.

Good luck!


Martin Grigorov
Wicket Training and Consulting
https://twitter.com/mtgrigorov

On Mon, Oct 27, 2014 at 8:37 PM, Jason Novotny jason.novo...@gmail.com
wrote:


 Hi Martin,

 Thanks for the help-- I've reached out to them, the js appears pretty
 complex
 http://cdn.datatables.net/1.10.3/js/jquery.dataTables.js


 They indicate that listeners need to be added according to:
 http://www.datatables.net/examples/advanced_init/events_live.html

 Is there any kind of mode in wicket possibly that would preserve the
 listeners in this way?

 Thanks, Jason


 On 10/26/14, 11:40 PM, Martin Grigorov wrote:

 Hi,

 Try with Ajax loading of the new pages.

 I am not sure how DataTables removes and re-adds the rows later. It should
 use jQuery's clone(true, true) to preserve the event bindings. Ask in
 their
 forums.

 Martin Grigorov
 Wicket Training and Consulting
 https://twitter.com/mtgrigorov

 On Sun, Oct 26, 2014 at 12:46 AM, Jason Novotny jason.novo...@gmail.com
 wrote:

  I've managed to figure out the cause of the problem but no solution.

 jquery datatables removes DOM elements when configured for pagination.
 This means the AjaxLinks in my listview generate wicket javascript like:

 Wicket.Ajax.ajax({u:./executed?7-1.IBehaviorListener.0-container-
 executedTransactionPanel-executedListView-0-
 detailsLink,e:click,c:
 detailsLinkff});;
 Wicket.Ajax.ajax({u:./executed?7-1.IBehaviorListener.0-container-
 executedTransactionPanel-executedListView-1-
 detailsLink,e:click,c:
 detailsLink100});;
 Wicket.Ajax.ajax({u:./executed?7-1.IBehaviorListener.0-container-
 executedTransactionPanel-executedListView-2-
 detailsLink,e:click,c:
 detailsLink101});;
 Wicket.Ajax.ajax({u:./executed?7-1.IBehaviorListener.0-container-
 executedTransactionPanel-executedListView-3-
 detailsLink,e:click,c:
 detailsLink102});;
 ...


 If the table has 2 pages, it removes the DOM elements from the 2nd page
 so
 I get the wicket debug error  Wicket.Ajax: Cannot bind a listener for
 event click on element elementId because the element is not in the
 DOM

 Now when I hit the link for next page of the table, the DOM has been
 updated to reflect the rows, but the javascript events need to be added
 again and so the links are broken.

 Is there any good way to do this?

 Thanks, Jason


 On 10/24/14, 1:24 PM, Jason Novotny wrote:

  I should add I'm using Wicket 6.17.

 Thanks, Jason

 On 10/24/14, 10:47 AM, Jason Novotny wrote:

  Hi,

 I'm using latest jquery DataTable with a ListView and in wicket:head of
 the page, I initiate the DataTable:

 $(function () {
  $('.datatable_executed').dataTable({
  'lengthChange': false,
  'dom': 'topdoc-filterholdeript',
  language: {info: _START_-_END_ of _TOTAL_},
  aaSorting: [],
  'iDisplayLength': 12
  });
  });

 It all looks good, however because one of my columns contains
 AjaxLinks,
 I get an error from my wicket debug window with the following:
 Wicket.Ajax: Cannot bind a listener for event click on element
 elementId because the element is not in the DOM

 The thing is the links seem to actually work on the first page, but
 when
 I click - to go to the next page the links don't work. Has anyone
 experienced this before or have any idea how I can debug this?

 Thanks, Jason




 -
 To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
 For additional commands, e-mail: users-h...@wicket.apache.org




Re: jquery DataTable + wicket Cannot bind a listener

2014-10-28 Thread Jason Novotny


Hi Martin,

Are there examples? What about this simple piece of code...

WebMarkupContainer tbody = new WebMarkupContainer(tbody);
tbody.add(new AjaxEventBehavior(onclick) {
@Override
protected void onEvent(AjaxRequestTarget target) {

}

protected void updateAjaxAttributes(AjaxRequestAttributes 
attributes) {

super.updateAjaxAttributes(attributes);
attributes.setChildSelector(td);
// TODO what do i do here?
}
});


Thanks, Jason

On 10/28/14, 1:10 AM, Martin Grigorov wrote:

Hi,

You should read about JavaScript event delegation. This is what they
recommend.

Wicket has basic support for this
with org.apache.wicket.ajax.attributes.AjaxRequestAttributes#setChildSelector.
I.e. you can register an Ajax behavior on the table or tbody and use
childSelector to listen for events only on specific children, e.g. 'tr',
'td', 'td div', etc.

This is more lightweight than using Wicket's built-in AjaxLink, but it is
also a bit more complex for you as an application developer.

Good luck!


Martin Grigorov
Wicket Training and Consulting
https://twitter.com/mtgrigorov

On Mon, Oct 27, 2014 at 8:37 PM, Jason Novotny jason.novo...@gmail.com
wrote:


Hi Martin,

Thanks for the help-- I've reached out to them, the js appears pretty
complex
http://cdn.datatables.net/1.10.3/js/jquery.dataTables.js


They indicate that listeners need to be added according to:
http://www.datatables.net/examples/advanced_init/events_live.html

Is there any kind of mode in wicket possibly that would preserve the
listeners in this way?

Thanks, Jason


On 10/26/14, 11:40 PM, Martin Grigorov wrote:


Hi,

Try with Ajax loading of the new pages.

I am not sure how DataTables removes and re-adds the rows later. It should
use jQuery's clone(true, true) to preserve the event bindings. Ask in
their
forums.

Martin Grigorov
Wicket Training and Consulting
https://twitter.com/mtgrigorov

On Sun, Oct 26, 2014 at 12:46 AM, Jason Novotny jason.novo...@gmail.com
wrote:

  I've managed to figure out the cause of the problem but no solution.

jquery datatables removes DOM elements when configured for pagination.
This means the AjaxLinks in my listview generate wicket javascript like:

Wicket.Ajax.ajax({u:./executed?7-1.IBehaviorListener.0-container-
executedTransactionPanel-executedListView-0-
detailsLink,e:click,c:
detailsLinkff});;
Wicket.Ajax.ajax({u:./executed?7-1.IBehaviorListener.0-container-
executedTransactionPanel-executedListView-1-
detailsLink,e:click,c:
detailsLink100});;
Wicket.Ajax.ajax({u:./executed?7-1.IBehaviorListener.0-container-
executedTransactionPanel-executedListView-2-
detailsLink,e:click,c:
detailsLink101});;
Wicket.Ajax.ajax({u:./executed?7-1.IBehaviorListener.0-container-
executedTransactionPanel-executedListView-3-
detailsLink,e:click,c:
detailsLink102});;
...


If the table has 2 pages, it removes the DOM elements from the 2nd page
so
I get the wicket debug error  Wicket.Ajax: Cannot bind a listener for
event click on element elementId because the element is not in the
DOM

Now when I hit the link for next page of the table, the DOM has been
updated to reflect the rows, but the javascript events need to be added
again and so the links are broken.

Is there any good way to do this?

Thanks, Jason


On 10/24/14, 1:24 PM, Jason Novotny wrote:

  I should add I'm using Wicket 6.17.

Thanks, Jason

On 10/24/14, 10:47 AM, Jason Novotny wrote:

  Hi,

I'm using latest jquery DataTable with a ListView and in wicket:head of
the page, I initiate the DataTable:

$(function () {
  $('.datatable_executed').dataTable({
  'lengthChange': false,
  'dom': 'topdoc-filterholdeript',
  language: {info: _START_-_END_ of _TOTAL_},
  aaSorting: [],
  'iDisplayLength': 12
  });
  });

It all looks good, however because one of my columns contains
AjaxLinks,
I get an error from my wicket debug window with the following:
Wicket.Ajax: Cannot bind a listener for event click on element
elementId because the element is not in the DOM

The thing is the links seem to actually work on the first page, but
when
I click - to go to the next page the links don't work. Has anyone
experienced this before or have any idea how I can debug this?

Thanks, Jason




-
To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
For additional commands, e-mail: users-h...@wicket.apache.org





-
To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
For additional commands, e-mail: users-h...@wicket.apache.org



Re: jquery DataTable + wicket Cannot bind a listener

2014-10-28 Thread Martin Grigorov
Hi,

On Tue, Oct 28, 2014 at 5:00 PM, Jason Novotny jason.novo...@gmail.com
wrote:


 Hi Martin,

 Are there examples? What about this simple piece of code...


I don't have any open source example at hand ... :-/



 WebMarkupContainer tbody = new WebMarkupContainer(tbody);
 tbody.add(new AjaxEventBehavior(onclick) {


use just 'click'


 @Override
 protected void onEvent(AjaxRequestTarget target) {

 }

 protected void updateAjaxAttributes(AjaxRequestAttributes
 attributes) {
 super.updateAjaxAttributes(attributes);
 attributes.setChildSelector(td);
 // TODO what do i do here?


this is enough to make a listener on the whole tbody that will notify you
only when a td is clicked

to make it useful you will need some JS code to extract the values for this
td

e.g. attributes.getDynamicExtraParameters().add(return
extractData(attrs.event))

where 'extractData' is a your own JS function that is loaded in the current
document. It can extract all needed info from the JS event - event.target,
some data-xyz attributes, anything you need
once extracted you will need to put it in a JS object as the one returned
by http://api.jquery.com/jquery.param/

P.S. I think Ernesto Barreiro have created a demo at his GitHub account
before for another Wicket user. But I don't see it as a project at
https://github.com/reiern70/antilia-bits

}
 });


 Thanks, Jason


 On 10/28/14, 1:10 AM, Martin Grigorov wrote:

 Hi,

 You should read about JavaScript event delegation. This is what they
 recommend.

 Wicket has basic support for this
 with org.apache.wicket.ajax.attributes.AjaxRequestAttributes#
 setChildSelector.
 I.e. you can register an Ajax behavior on the table or tbody and use
 childSelector to listen for events only on specific children, e.g. 'tr',
 'td', 'td div', etc.

 This is more lightweight than using Wicket's built-in AjaxLink, but it is
 also a bit more complex for you as an application developer.

 Good luck!


 Martin Grigorov
 Wicket Training and Consulting
 https://twitter.com/mtgrigorov

 On Mon, Oct 27, 2014 at 8:37 PM, Jason Novotny jason.novo...@gmail.com
 wrote:

  Hi Martin,

 Thanks for the help-- I've reached out to them, the js appears pretty
 complex
 http://cdn.datatables.net/1.10.3/js/jquery.dataTables.js


 They indicate that listeners need to be added according to:
 http://www.datatables.net/examples/advanced_init/events_live.html

 Is there any kind of mode in wicket possibly that would preserve the
 listeners in this way?

 Thanks, Jason


 On 10/26/14, 11:40 PM, Martin Grigorov wrote:

  Hi,

 Try with Ajax loading of the new pages.

 I am not sure how DataTables removes and re-adds the rows later. It
 should
 use jQuery's clone(true, true) to preserve the event bindings. Ask in
 their
 forums.

 Martin Grigorov
 Wicket Training and Consulting
 https://twitter.com/mtgrigorov

 On Sun, Oct 26, 2014 at 12:46 AM, Jason Novotny 
 jason.novo...@gmail.com
 wrote:

   I've managed to figure out the cause of the problem but no solution.

 jquery datatables removes DOM elements when configured for pagination.
 This means the AjaxLinks in my listview generate wicket javascript
 like:

 Wicket.Ajax.ajax({u:./executed?7-1.IBehaviorListener.0-container-
 executedTransactionPanel-executedListView-0-
 detailsLink,e:click,c:
 detailsLinkff});;
 Wicket.Ajax.ajax({u:./executed?7-1.IBehaviorListener.0-container-
 executedTransactionPanel-executedListView-1-
 detailsLink,e:click,c:
 detailsLink100});;
 Wicket.Ajax.ajax({u:./executed?7-1.IBehaviorListener.0-container-
 executedTransactionPanel-executedListView-2-
 detailsLink,e:click,c:
 detailsLink101});;
 Wicket.Ajax.ajax({u:./executed?7-1.IBehaviorListener.0-container-
 executedTransactionPanel-executedListView-3-
 detailsLink,e:click,c:
 detailsLink102});;
 ...


 If the table has 2 pages, it removes the DOM elements from the 2nd page
 so
 I get the wicket debug error  Wicket.Ajax: Cannot bind a listener for
 event click on element elementId because the element is not in the
 DOM

 Now when I hit the link for next page of the table, the DOM has been
 updated to reflect the rows, but the javascript events need to be added
 again and so the links are broken.

 Is there any good way to do this?

 Thanks, Jason


 On 10/24/14, 1:24 PM, Jason Novotny wrote:

   I should add I'm using Wicket 6.17.

 Thanks, Jason

 On 10/24/14, 10:47 AM, Jason Novotny wrote:

   Hi,

 I'm using latest jquery DataTable with a ListView and in wicket:head
 of
 the page, I initiate the DataTable:

 $(function () {
   $('.datatable_executed').dataTable({
   'lengthChange': false,
   'dom': 'topdoc-filterholdeript',
   language: {info: _START_-_END_ of _TOTAL_},
   aaSorting: [],
   'iDisplayLength': 12
   });
   });

 It all looks good, however because 

Re: jquery DataTable + wicket Cannot bind a listener

2014-10-27 Thread Martin Grigorov
Hi,

Try with Ajax loading of the new pages.

I am not sure how DataTables removes and re-adds the rows later. It should
use jQuery's clone(true, true) to preserve the event bindings. Ask in their
forums.

Martin Grigorov
Wicket Training and Consulting
https://twitter.com/mtgrigorov

On Sun, Oct 26, 2014 at 12:46 AM, Jason Novotny jason.novo...@gmail.com
wrote:


 I've managed to figure out the cause of the problem but no solution.

 jquery datatables removes DOM elements when configured for pagination.
 This means the AjaxLinks in my listview generate wicket javascript like:

 Wicket.Ajax.ajax({u:./executed?7-1.IBehaviorListener.0-container-
 executedTransactionPanel-executedListView-0-detailsLink,e:click,c:
 detailsLinkff});;
 Wicket.Ajax.ajax({u:./executed?7-1.IBehaviorListener.0-container-
 executedTransactionPanel-executedListView-1-detailsLink,e:click,c:
 detailsLink100});;
 Wicket.Ajax.ajax({u:./executed?7-1.IBehaviorListener.0-container-
 executedTransactionPanel-executedListView-2-detailsLink,e:click,c:
 detailsLink101});;
 Wicket.Ajax.ajax({u:./executed?7-1.IBehaviorListener.0-container-
 executedTransactionPanel-executedListView-3-detailsLink,e:click,c:
 detailsLink102});;
 ...


 If the table has 2 pages, it removes the DOM elements from the 2nd page so
 I get the wicket debug error  Wicket.Ajax: Cannot bind a listener for
 event click on element elementId because the element is not in the DOM

 Now when I hit the link for next page of the table, the DOM has been
 updated to reflect the rows, but the javascript events need to be added
 again and so the links are broken.

 Is there any good way to do this?

 Thanks, Jason


 On 10/24/14, 1:24 PM, Jason Novotny wrote:


 I should add I'm using Wicket 6.17.

 Thanks, Jason

 On 10/24/14, 10:47 AM, Jason Novotny wrote:

 Hi,

 I'm using latest jquery DataTable with a ListView and in wicket:head of
 the page, I initiate the DataTable:

 $(function () {
 $('.datatable_executed').dataTable({
 'lengthChange': false,
 'dom': 'topdoc-filterholdeript',
 language: {info: _START_-_END_ of _TOTAL_},
 aaSorting: [],
 'iDisplayLength': 12
 });
 });

 It all looks good, however because one of my columns contains AjaxLinks,
 I get an error from my wicket debug window with the following:
 Wicket.Ajax: Cannot bind a listener for event click on element
 elementId because the element is not in the DOM

 The thing is the links seem to actually work on the first page, but when
 I click - to go to the next page the links don't work. Has anyone
 experienced this before or have any idea how I can debug this?

 Thanks, Jason






Re: jquery DataTable + wicket Cannot bind a listener

2014-10-27 Thread Jason Novotny


Hi Martin,

Thanks for the help-- I've reached out to them, the js appears pretty 
complex

http://cdn.datatables.net/1.10.3/js/jquery.dataTables.js


They indicate that listeners need to be added according to:
http://www.datatables.net/examples/advanced_init/events_live.html

Is there any kind of mode in wicket possibly that would preserve the 
listeners in this way?


Thanks, Jason

On 10/26/14, 11:40 PM, Martin Grigorov wrote:

Hi,

Try with Ajax loading of the new pages.

I am not sure how DataTables removes and re-adds the rows later. It should
use jQuery's clone(true, true) to preserve the event bindings. Ask in their
forums.

Martin Grigorov
Wicket Training and Consulting
https://twitter.com/mtgrigorov

On Sun, Oct 26, 2014 at 12:46 AM, Jason Novotny jason.novo...@gmail.com
wrote:


I've managed to figure out the cause of the problem but no solution.

jquery datatables removes DOM elements when configured for pagination.
This means the AjaxLinks in my listview generate wicket javascript like:

Wicket.Ajax.ajax({u:./executed?7-1.IBehaviorListener.0-container-
executedTransactionPanel-executedListView-0-detailsLink,e:click,c:
detailsLinkff});;
Wicket.Ajax.ajax({u:./executed?7-1.IBehaviorListener.0-container-
executedTransactionPanel-executedListView-1-detailsLink,e:click,c:
detailsLink100});;
Wicket.Ajax.ajax({u:./executed?7-1.IBehaviorListener.0-container-
executedTransactionPanel-executedListView-2-detailsLink,e:click,c:
detailsLink101});;
Wicket.Ajax.ajax({u:./executed?7-1.IBehaviorListener.0-container-
executedTransactionPanel-executedListView-3-detailsLink,e:click,c:
detailsLink102});;
...


If the table has 2 pages, it removes the DOM elements from the 2nd page so
I get the wicket debug error  Wicket.Ajax: Cannot bind a listener for
event click on element elementId because the element is not in the DOM

Now when I hit the link for next page of the table, the DOM has been
updated to reflect the rows, but the javascript events need to be added
again and so the links are broken.

Is there any good way to do this?

Thanks, Jason


On 10/24/14, 1:24 PM, Jason Novotny wrote:


I should add I'm using Wicket 6.17.

Thanks, Jason

On 10/24/14, 10:47 AM, Jason Novotny wrote:


Hi,

I'm using latest jquery DataTable with a ListView and in wicket:head of
the page, I initiate the DataTable:

$(function () {
 $('.datatable_executed').dataTable({
 'lengthChange': false,
 'dom': 'topdoc-filterholdeript',
 language: {info: _START_-_END_ of _TOTAL_},
 aaSorting: [],
 'iDisplayLength': 12
 });
 });

It all looks good, however because one of my columns contains AjaxLinks,
I get an error from my wicket debug window with the following:
Wicket.Ajax: Cannot bind a listener for event click on element
elementId because the element is not in the DOM

The thing is the links seem to actually work on the first page, but when
I click - to go to the next page the links don't work. Has anyone
experienced this before or have any idea how I can debug this?

Thanks, Jason





-
To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
For additional commands, e-mail: users-h...@wicket.apache.org



Re: jquery DataTable + wicket Cannot bind a listener

2014-10-25 Thread Jason Novotny


I've managed to figure out the cause of the problem but no solution.

jquery datatables removes DOM elements when configured for pagination. 
This means the AjaxLinks in my listview generate wicket javascript like:


Wicket.Ajax.ajax({u:./executed?7-1.IBehaviorListener.0-container-executedTransactionPanel-executedListView-0-detailsLink,e:click,c:detailsLinkff});;
Wicket.Ajax.ajax({u:./executed?7-1.IBehaviorListener.0-container-executedTransactionPanel-executedListView-1-detailsLink,e:click,c:detailsLink100});;
Wicket.Ajax.ajax({u:./executed?7-1.IBehaviorListener.0-container-executedTransactionPanel-executedListView-2-detailsLink,e:click,c:detailsLink101});;
Wicket.Ajax.ajax({u:./executed?7-1.IBehaviorListener.0-container-executedTransactionPanel-executedListView-3-detailsLink,e:click,c:detailsLink102});;
...


If the table has 2 pages, it removes the DOM elements from the 2nd page 
so I get the wicket debug error  Wicket.Ajax: Cannot bind a listener 
for event click on element elementId because the element is not in 
the DOM


Now when I hit the link for next page of the table, the DOM has been 
updated to reflect the rows, but the javascript events need to be added 
again and so the links are broken.


Is there any good way to do this?

Thanks, Jason

On 10/24/14, 1:24 PM, Jason Novotny wrote:


I should add I'm using Wicket 6.17.

Thanks, Jason

On 10/24/14, 10:47 AM, Jason Novotny wrote:

Hi,

I'm using latest jquery DataTable with a ListView and in wicket:head 
of the page, I initiate the DataTable:


$(function () {
$('.datatable_executed').dataTable({
'lengthChange': false,
'dom': 'topdoc-filterholdeript',
language: {info: _START_-_END_ of _TOTAL_},
aaSorting: [],
'iDisplayLength': 12
});
});

It all looks good, however because one of my columns contains 
AjaxLinks, I get an error from my wicket debug window with the 
following: Wicket.Ajax: Cannot bind a listener for event click on 
element elementId because the element is not in the DOM


The thing is the links seem to actually work on the first page, but 
when I click - to go to the next page the links don't work. Has 
anyone experienced this before or have any idea how I can debug this?


Thanks, Jason







Re: jquery DataTable + wicket Cannot bind a listener

2014-10-24 Thread Jason Novotny


I should add I'm using Wicket 6.17.

Thanks, Jason

On 10/24/14, 10:47 AM, Jason Novotny wrote:

Hi,

I'm using latest jquery DataTable with a ListView and in wicket:head 
of the page, I initiate the DataTable:


$(function () {
$('.datatable_executed').dataTable({
'lengthChange': false,
'dom': 'topdoc-filterholdeript',
language: {info: _START_-_END_ of _TOTAL_},
aaSorting: [],
'iDisplayLength': 12
});
});

It all looks good, however because one of my columns contains 
AjaxLinks, I get an error from my wicket debug window with the 
following: Wicket.Ajax: Cannot bind a listener for event click on 
element elementId because the element is not in the DOM


The thing is the links seem to actually work on the first page, but 
when I click - to go to the next page the links don't work. Has 
anyone experienced this before or have any idea how I can debug this?


Thanks, Jason




-
To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
For additional commands, e-mail: users-h...@wicket.apache.org