[html5] Waiting for an object to be defined in javascript

[Larry Martell]

On Thu, May 22, 2014 at 5:38 PM, Bill Barron <bill.r.barron at gmail.com> wrote:
> Is this app using jQuery? I'm not familliar with sorttable, but it looks
> like it goes way out of its way to avoid using jQuery for things like event
> handling and DOM selection, traversal and manipulation. Here is another
> table library that is pretty powerful if you are already using jQuery, might
> as well take advantage of it: https://datatables.net/

No this does not use jQuery. For apps that use that I usually use
tablesorter (http://tablesorter.com/docs/)

> Can you save the sort column and direction as a cookie each time a column
> header is clicked (looks like you would need to modify the sorttable code)?

No a lot of users have cookies disabled.

> Can you do any server-side sorting based on the column and direction that is
> passed back to the server so that your table is initially sorted as the user
> desires before the page loads?

Perhaps, but that is not the approach I took.


>
>
> On Thu, May 22, 2014 at 3:54 PM, Larry Martell <larry.martell at gmail.com>
> wrote:
>>
>> On Thu, May 22, 2014 at 3:59 PM, Bill Barron <bill.r.barron at gmail.com>
>> wrote:
>> > Think of it this way. It is this mailing list's responsibility to send
>> > email
>> > updates to its subscribers as they come in and not the subscribers
>> > responsibility to check for updates every 10 seconds. This is not only
>> > less
>> > resource intensive for the mailing list, it's also more efficient for
>> > the
>> > subscribers.
>>
>> Thanks I appreciate your replies. I understand about event driven
>> programming vs polling. This is a big nasty old PHP app that I
>> inherited. I was asked to add client side column based sorting to it,
>> which I did using the sorttable package
>> (http://www.kryogenix.org/code/browser/sorttable/). That was all fine.
>> Then I was asked to make the client side sort selection persist across
>> a server side refresh. This is where I went down the rabbit hole. To
>> achieve this I added a hidden field that gets set to the sort column
>> id (along with the sort direction) by the sorttable onclick handler. I
>> pass that back with the form to the server, who passes it back to the
>> browser. I then test for it, and if it's set I call the sorttable
>> function. Problem is that I can't call the function before it is
>> defined. I think I have this solved with this code:
>>
>> var interval = setInterval(function() {
>>     if (typeof(parent.frames['main_frame'].sorttable) === 'undefined')
>> return;
>>     if (!
>> parent.frames['main_frame'].sorttable.hasOwnProperty('innerSortFunction'))
>> return;
>>     clearInterval(interval);
>>
>> parent.frames['main_frame'].sorttable.innerSortFunction.apply(parent.frames['main_frame'].document.getElementById("OpenFace-3"),
>> []);
>> }
>>
>> It may not be pretty, but it appear to be working and I can move on to
>> more interesting things.
>>
>>
>> > On Thu, May 22, 2014 at 2:49 PM, Bill Barron <bill.r.barron at gmail.com>
>> > wrote:
>> >>
>> >> I agree with Rick. You need to see what code is defining someObject or
>> >> what code is setting the class on the table and when that code defines
>> >> someObject it should trigger an event that the rest of your code
>> >> listens for
>> >> or provide some method of checking when it has loaded. If this is
>> >> Modernizr
>> >> and you're doing feature detection, then check out Modernizr.load().
>> >> (formerly YepNope). If you are just waiting for a script to load, you
>> >> may be
>> >> interested in AMD JavaScript modules.  If your scripts are loaded and
>> >> you
>> >> are just waiting for some event to take place or some object to be
>> >> defined,
>> >> then modify the code that defines someObject or sets the table class or
>> >> see
>> >> if it has functionality built in already to notify the rest of your
>> >> code
>> >> that it is ready. It is that object's job to notify the rest of your
>> >> code
>> >> through events or promises that it has done it's part and defined
>> >> someObject.
>> >>
>> >> If the thing that defines someObject is your own code and not a 3rd
>> >> party
>> >> library or framework, consider adding a getSomeObject method that
>> >> returns a
>> >> promise. That way you could just do this:
>> >>
>> >> getSomeObject.then(function (someObject) {
>> >>     // use someObject here
>> >> });
>> >>
>> >> Thanks,
>> >> Bill
>> >>
>> >>
>> >> On Thu, May 22, 2014 at 2:41 PM, Larry Martell
>> >> <larry.martell at gmail.com>
>> >> wrote:
>> >>>
>> >>> On Thu, May 22, 2014 at 3:13 PM, Rik Sagar <org.whatwg at sagar.org>
>> >>> wrote:
>> >>> > Depends where the object comes from is and who's setting it!
>> >>> >
>> >>> > Couldn't you fire an event when the object is created, then do
>> >>> > whatever
>> >>> > work
>> >>> > you need to do in the event listener ?
>> >>> >
>> >>> > Alternatively, can "someObject" be an object inside "otherObject",
>> >>> > for
>> >>> > example, otherObject.someObject.
>> >>> >
>> >>> > If you have it that way, you can write a setter/getter on
>> >>> > "otherObject"
>> >>> > for
>> >>> > someObject.  When someone does "otherObject.someObject = new
>> >>> > Object();"
>> >>> > your
>> >>> > setter function gets called with the new value.
>> >>> >
>> >>> > Either is preferable to the busy loop approach if you can do it.
>> >>>
>> >>> The scenario is: After my page is loaded I need to call a js function
>> >>> that will only exist some time after a table gets given a certain
>> >>> class. When I try to call that function from an onload function it
>> >>> fails most of the time because the function has not yet been defined.
>> >>> If I call that function from a setTimeout that waits 1 second it works
>> >>> 99% of the time. I'd like to just wait until the class gets put on the
>> >>> table and the function exists and then call it.
>> >>>
>> >>> I think I may have this working. I did this:
>> >>>
>> >>> var interval = setInterval(function() {
>> >>>     if (typeof elem == 'undefined') return;
>> >>>     clearInterval(interval);
>> >>>
>> >>>     // the rest of the code
>> >>> }, 10);
>> >>>
>> >>> So far this looks good. I need to run it for a day or 2 and make sure.
>> >>>
>> >>>
>> >>> > On Thu, May 22, 2014 at 10:32 AM, Larry Martell
>> >>> > <larry.martell at gmail.com>
>> >>> > wrote:
>> >>> >>
>> >>> >> I need to do the equivalent of this in javascript:
>> >>> >>
>> >>> >> while (typeof someObject == 'undefined') {
>> >>> >>      sleep(10);  // 10ms
>> >>> >> }
>> >>> >>
>> >>> >> And I just can't quite figure out how to code this.
>> >>> >>
>> >>> >> I have this:
>> >>> >>
>> >>> >>
>> >>> >> function sleep(ms, callback, arg) {
>> >>> >>     setTimeout(function() {
>> >>> >>         callback(arg);
>> >>> >>     }, ms);
>> >>> >> }
>> >>> >>
>> >>> >> function waitForDef(elem) {
>> >>> >>     if (typeof elem == 'undefined') {
>> >>> >>         sleep(10, waitForDef, elem)
>> >>> >>     }
>> >>> >> }
>> >>> >>
>> >>> >> But it's not clear to me how to use this from my code.
>> >>> _______________________________________________
>> >>> Help mailing list
>> >>> Help at lists.whatwg.org
>> >>> http://lists.whatwg.org/listinfo.cgi/help-whatwg.org
>> >>
>> >>
>> >
>
>