83555

Callback function for Datatable.net paging buttons click

Question:

I am trying to tap into the click event for when one of the paging buttons on the Datatable is clicked, but not sure how I will achieve this in Angular.

I if I look at <a href="https://stackoverflow.com/questions/42161805/how-to-catch-an-event-on-pagination-buttons-next-previous-of-the-datatables" rel="nofollow">this</a> example, how will I possibly write the same code in Angular, and within the click event, emit an event through an @Output property, so that my parent component can be notified that an paging event fired?

Answer1:

If you want to handle the click event in the in the component where you initialized the datatable, there is no need to emit the event. Simply use the code in the example you provided in the component and your event will work just fine.

<a href="https://stackblitz.com/edit/angular-hxdbgi-baaedu?file=app%2Ftab-nav-bar-basic-example.ts" rel="nofollow">Here</a> i have created an angular version of the example you provided. Click on next on the datatable paginator and you will see the event firing.

However if you want to handle the event in the parent component of the component where you initialized the datatable, you need emit and event through @Output and handle it in child component. Or you can use any other component interaction technique that may suite your logic.

Hope this helps

Answer2:

After trying the above solutioin provided, it did not exactly work for me.

I had to change the implementation provided, as follow:

drawCallback: () => { $(document).on('click', '#datatables_next', () => { this.nextClicked.emit("continuation"); }); $(document).on('click', '#datatables_previous', () => { console.log('next clicked...'); }); }

The problem is, with the provided solution, my events were never fired. This is due to the fact that the pagination controls are loaded dynamically I think, and at time of me trying to bind to those controls, they were not there.

Recommend

  • Celery + Redis - .get() hangs indefinitely after running smoothly for ~70 hours
  • Delphi TCollection - Possible to prevent changing items in run-time?
  • use images instead of text in webgrid asp mvc
  • Extjs, handling success or failure when doing a standard submit in a form
  • Gforce min not supported for character in data.table
  • Understanding Intl.DateTimeFormat as a JavaScript object
  • What do I do with this error when I run tests in rails?
  • How to replace TouchesBegan with UIGestureRecognizer
  • Fire callback when selection was made with select2 4.0, and retrieve the value of last selection
  • MRO with multiple inheritance in python
  • ConnectivityManager.CONNECTIVITY_ACTION deprecated
  • Adding Parent and Child Nodes in TreeView from Sql Server 2008
  • Change Checkbox value without raising event
  • Clarification on min distance on LocationManager.requestLocationUpdates method, min Distance paramet
  • WPF ICommand CanExecute(): RaiseCanExecuteChanged() or automatic handling via DispatchTimer?
  • How solve “Qt: Untested Windows version 10.0 detected!”
  • How can I enlarge video fullscreen without the affected interface project in as3?
  • Keep this build forever option - Jenkins
  • dc-js disable selecting slices on click for pie chart
  • Django rest serializer Breaks when data exists
  • Typescript - Unable to get 'import' statement to function
  • Meteor: Do Something On Email Verification Confirmation
  • How to clear text inside text field when radio button is select
  • How to rebase a series of branches?
  • Disabling Alt-F4 on a Win Forms NotifyIcon
  • Retrieving value from sql ExecuteScalar()
  • Why ng-show works with ng-repeat but ng-if doesn't? [duplicate]
  • Azure Cloud Service Web Role web pages do not load
  • Updating server-side rendering client-side
  • Javascript Callbacks with Object constructor
  • How can I use Kendo UI with Razor?
  • what is the difference between the asp.net mvc application and asp.net web application
  • jquery mobile loadPage not working
  • R: gsub and capture
  • jqPlot EnhancedLegendRenderer plugin does not toggle series for Pie charts
  • Data Validation Drop Down Box Arrow Disappearing
  • Comma separated Values
  • How do you join a server to an Active Directory (domain)?
  • Java static initializers and reflection
  • How to load view controller without button in storyboard?