-
Notifications
You must be signed in to change notification settings - Fork 22
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Initializing static search with <div id="staticSearch"> after document loads #287
Comments
@peterrobinson Just edited your description so I could see the code! I don't really understand the problem, but if I could see one of the pages where you've tried to get this working and it doesn't, it would be much easier to figure out. I honestly don't see why anyone would embed the whole search in every page at all; surely it's just better to have a search box that submits to the one search page? When you drop the static search code into your pages, are you doing all the initialization stuff that's required? Are you sure you're including ssInitialize.js? That does the crucial stuff:
|
The difference is the way staticSearch is loaded seems to affect its functioning, in ways I don't understand. Here is what works: <html>
<body>
<div id="staticSearch">
<script xmlns='http://www.w3.org/1999/xhtml' src='staticSearch/ssSearch-debug.js'></script>
<script xmlns='http://www.w3.org/1999/xhtml' src='staticSearch/ssInitialize.js'></script>
--- all the rsst of the staticSearch stuff
---all the rest of the document
</body>
</html> In this configuration, staticSearch is iniatialized in the first document load, alll the stuff it needs is in place and all is fine. However, for various obscure reasons, I wanted to load a bunch of stuff in AFTER the document load, using the "onload" call on the body tag, thus: <html>
<body onload="getStuff">
<div id="staticSearch"></div>
-- all the rest of the document
</body>
</html> In this configuration the function getStuff contains a call to a file which holds the static search script, something like: function getStuff()(
$( "#staticSearch" ).load("path-to-file-with static search scripts")...
} For some reason, doing it this second way does not work, likely because the ssinitialize script doesn't get called when the staticSearch div is populated with the staticSearch scripts. I've tried various permutations of .load .get .ajax etc and ti won't work. My code has dozens or more of a similar functions with scripts called after the DOM loads and then executing just fine, so I don't understand what is happening. No great deal. It wasn't too hard to reconfigure so staticsearch always loads on the document load. Might be worth a note in the documentation. |
@peterrobinson I think we already cover that in this section: https://endings.uvic.ca/staticSearch/docs/howDoesItWork.html#jsInitialization Is there anything else that you think is missing? |
No I don't think the documentation covers the case at all. I am still baffled by this behaviour. I don't see anywhere in all the materials on the web about javascript any clue as to why something initialized after the first document load behaves differently from something initialized during the first document load. But that seems to be what happens. (Is it something really obscure? like, somehow quirks mode is switched on? Is it a security thing, forbidding certain facilities after the initial document load? is it something about using 'body onload' rather than 'window.addEventListener('load', ...'? ) I have implememented an easy work-around. And I don't discount that there might be some clash with all the other stuff my javascript does on every document load so maybe this is just me. But I do think it is at least worth a warning in your documentation: staticSearch might not work if not initialized in the first document load. |
@peterrobinson If the thing being initialized needs to read content from the page itself in order to configure itself (as staticSearch does), then trying to initialize it before the document finishes loading will obviously fail. However, the body element's onload event is supposed to be equivalent to window.onload as far as I understand it, so I don't think that can be the problem. Shouldn't there be parentheses in this, though?
It rather seems that you're trying to load the staticSearch JavaScript after the page load, though, which is a different thing from calling its initialization after the page load. I think you would need to wait for that JavaScript itself to load before you could initialize the staticSearch. I see JQuery in there too, though, so who knows... |
I think I have figured out what is going on. In your default configuration, the loading of the staticSearch files is done as part of the initial loading of the whole page. You then have this line in your code: var Sch; Because this is ONLY called after complete loading of all files etc in the document initialization, new StaticSearch() functions exactly as it should, and Sch sits there waiting for a search. However, when I tried to load staticSearch after the document initialization, the critical Sch = new StaticSearch() never gets called. And that is why staticSearch does not work. One could (theoretically) get around this by loading up the staticSearch files after document initialization (as I was doing) and then after they were all loaded calling Sch = new StaticSearch() (as I did not do). In practice, this is rather tricky: trying to call Sch = new StaticSearch() before all the files are loaded will generate an error. And it's not easy to monitor whether files are fully loaded, outside the initial onload event, which is not available after the initial load. One could do it using promises and the async library, but I would rather not go there. Maybe not worth pointing out in the documentation. Any poor fool wanting to do this can find this ticket. |
@peterrobinson I'm not quite sure what "loading of all files" means in this context; the staticSearch object itself (Sch) is responsible for loading all staticSearch-related files following its own initialization, and it doesn't need any other files, so I don't see why it would need to wait for the loading of any other files not directly related to staticSearch. However, it does require that the DOM be loaded, because it needs to find all of the form controls in the search form. So I don't really know what we would add to the documentation, to be honest. Should I just close this? |
As I said — anyone trying to do this is going to find their way to this ticket. By then they are likely well aware of DOM loading issues. I think the documentation might say, specifically, that the default behaviour is for ssSearch to be initialized after the DOM loads, at which point |
@peterrobinson With this: "is responsible for loading all staticSearch-related files following its own initialization" I was talking about all the JSON files required to do searches, not the StaticSearch code itself; obviously you can't initialize an object till its own code is available. But as soon as it is initialized, it starts loading various things in the background, ready to do searches. |
Closing this in favour of #294. |
This is not a specially problematic issue: rather something for your documentation. Again, this is something which has arisen because I am doing the non-standard thing of embedding staticSearch in every page of HTML. So the process you describe, where staticSearch happily embeds itself in a single file for the entire collection, in which you have the magic
<div id="staticSearch">
where static search obligingly puts the stuff it needs to work -- does not work for me. A few points:<div id="staticSearch">
.You might want to investigate why the staticSearch only works if is loaded in on initialization of the document (ie before any "onload" call is issued, typically before the body loads). I am guessing it is something to do with the dark world of element load handlers. Anyway, a note somewhere about this would be useful.
The text was updated successfully, but these errors were encountered: