How to bind elements to dom AFTER page length change?

TomHall

I am struggling with a binding issue. My table loads with 10 rows. I am using Cleave to make sure a columns input fields are only numbers. It works fine - until I change the length of the table from 10 rows to n rows. Then the rows after 10 do not work with Cleave.

I created a function called bindME()

    function bindME(){

            document.querySelectorAll('.leadAMT').forEach(
                function(obj){
                 console.log(obj);            
                 new Cleave(obj,{
                    numeral: true,
                    numeralThousandGroupStyle: 'thousand'
                });
            });

            $(".roID").focus(function(){
            // croID is current roID
            var croID,leadID;
            croID = $(this).val();
            leadID = $(this).attr("data-id");  
            console.log("hello world");
            });
    }

and I tried using the example

    $('#leadTable').on( 'length.dt', function ( e, settings, len ) {
    console.log( 'New page length: '+len );
    setTimeout(bindME,2000);
    });

But unless I call bindME with a setTimeout function calling bindME does not work..

A friend told me there must be some type of event handler that would fire bindME once all the rows have completed loading.

Any help please?

kthorngren

I'm not familiar with bindME and all the options to initialize it. Looks like your bindME() function loops through the selected elements to initialize. When using Datatables the only rows in the DOM or those displayed on the page. Which is why your initialization only applies to the first page.

My suggestion is to try initializing bindME in rowCallback. You can initialize it on a row by row basis each time the page is changed or page length, etc. I'm not sure if you will need to destroy any previous bindings of bindME so there aren't multiple events applied.

If you need help with this please provide a simple running test case with bindME so we can help structure your code.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

Kevin

TomHall

Thank you Kevin, much appreciated.