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

Bill Barron bill.r.barron at gmail.com
Thu May 22 14:38:16 PDT 2014


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/

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)?
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?


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
> >>
> >>
> >
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.whatwg.org/pipermail/help-whatwg.org/attachments/20140522/e9e43fa6/attachment.htm>


More information about the Help mailing list