Question

What I have today is a script I’ve inherited, and can’t remove to go with something else for the time being at least. Which normally would be fine, however the author of the original script “packed” it so the code is far from readable. With that the script lacks functionality I am now required to put it despite my protest of it not being all to possible with the code base as is. So I am not trying to come out with workarounds. This moments work around notion is based off of a button click I can’t alter.

What the button does is open a file dialog, where the user selects a file, and upon selection it gets added to a Unordered List (UL). While trying to think of hacks I came up with the idea what if just like a “select” form element you can do an onChange event trigger so when a user selects something there. Something does something. So I am wondering if I can achieve something similar. Something that will in a sense listen to the DOM see when that particular element changes and if its being added to run one of the post checks I want to run. I don’t know how to look that one up. So I am wondering if anyone here may have some insight for me.

Answer 1

Try using $.doTimeout() to ‘listen’ to changes in the </ul> and run a function if a </li> gets added like this:

// The List //
<ul class="theList">
    <li>Some Value</li>
    <li>Some Value</li>
    <li>Some Value</li>
</ul>    

// Set Initial </li> Count //
var li = $('.theList li').length;

$('.theList').doTimeout('check', 250, function(){
    if ($('.theList li').length > li)
    {
        // ...Run Function Here... //

        // Update Total </li> Elements //
        li = $('.theList li').length;
    }

    // Return True to Continue Polling //
    return true;
});

I hope this helps!