I'm currently studying the jQuery ajax methods and trying to take a little more in-depth look into them. I was playing with the global event handlers: ajaxStart, ajaxSend, etc. I understand how they work, but I can't think of any good use cases for them.
I've seen examples where they are used for loggers which seems feasible enough, but why make them methods and not stand alone functions that can be called like $.ajax(). It seems if I don't have any particular element to attach them to I just set it to the $(document) anyway.
Also, being able to use $(this) inside of the handlers does not seem like much of a benefit over just doing $("#log").
Have these been a life savor for anyone, are there any other use cases outside of a global logger?
The global event handlers are useful for showing indicators to the user as well. That way their experience is consistent (same indicators when saving/loading) and you don't have to write the same code over and over.
The ajaxError method is great for global ajax error handling. Instead of having an error callback on all of your ajax calls, you can use the global and have it log somewhere. You can access all the information from the original ajax call from ajaxError.
$(this) insead of $('div span.foo div[data-foo="foo"] > input.EVIL') or $('*')can be a life saver...
It depends on the exact scenario, but it ALWAYS better and a good practice...
And the case you want for the ajaxsetup: Pass the same options to a jQuery function over and over
Here is a guy that this option helped him out.
Related
I'm following a tutorial on MDN for Javascript and they add an onclick handler to a button and then call a function within a function:
myButton.onclick = function() {
setUserName();
}
I tried assigning the event to the function directly and it still worked, so I wondered if there's any good reason to do it their way.
If the function doesn't care about the event object that gets passed as the first argument, no. It bloats the code, creates an extra object in memory and has no benefit.
Defining a lambda function for handling an event is a dirty way of coding, IMO. It's much cleaner and safer to separate interface and actual processing.
If you need to do something complicated in your handler, it's just as easy to define a properly named function to do the job, and assign the handler to it.
Once you have done this terrible naming effort, you can do whatever you want with your handler, including testing it by feeding dummy events, reusing it for handling events from different buttons, etc.
On the other hand, web pages that will probably not be around for more than a few weeks or months at most are not the best place for clean coding anyway...
in Backbone.
http://backbonejs.org/#Events-on
I have a single event bus with no namespacing. I don't understand why you would need to use "all".
The example used in the notes is for a proxy but I don't understand why you would want to do this.
You can come up with different use cases, for example:
Logging all changes that happen on the object
Using it as Adapter from one framework to the other
Wrapping original object in proxy object, and triggering events through it
e t.c.
It's up to you, if you need to use it or not, it's just there, with no obligations.
I use this to let the user "something" is going on. As a programmer I am also aware that Backbone is firing events.
You can use a subtle animation that shows the page is firing events.
It is also a good way to give a top level view of how your application is working.
I'm trying to create a loader that tracks when AJAX calls start and end. It's using JSONP so the .ajaxComplete() doesn't work / isn't reliable.
Ideally I'd like to modify getJSON so that every time it is called a function, addAJAX(), is also called. The callback will also fire a function removeAJAX().
Currently I'm having to do this by adding in functions to every getJSON, of which there are many and likely to be many more.
For example:
// Add ajax tracker
hl.addAJAX();
$.getJSON('someurl.com?callback=?',{ key: APIKEY }, function(json) {
// Remove the ajax tracker
hl.removeAJAX();
});
Creating a wrapper function for AJAX calls is one option, but I'd really like to know if jQuery can be modified this way?
Yes you can override jQuery to do such actions. I have posted one answer for a similar type question. So Instead of re-posting, providing the reference -
How to get default error of ajax call
Technically it certainly could be done -- jQuery is just JavaScript, so you could dig through the sources .js files, find the method in question and modify to your heart's content. However, this certainly isn't a trivial edit and I would strongly advise you against modifying core functionality of third party libraries unless you think that there's no other feasible option and you're ready for what comes along with it.
I say that because that will mean, among other things, that you'll have to maintain those changes when you're trying to move to future versions, and that you may break support for other libraries or plugins which expect certain functions to work certain ways.
As much as it may be annoying to call the function in the callback every time, that's the recommended way of accomplishing this type of functionality.
I'm new to lo-dash, and wanted to know is it possible to use _.bind as $.bind and how can I accomplish this? I really want to get rid of jQuery and use something smaller...
What I need is to bind DOM events to functions
Those are two different mechanisms.
_.bind sets the this value of a function to the first parameter so that 'this' will always point to the same object in the function. I'd say it binds the scope of 'this' to the function, except that would be incorrect technically.
$.bind adds a jquery triggered event listener to a jquery wrapped element.
There are plenty of dom selection alternatives (such as zepto.js), but lodash/underscore libraries are really in addition to jquery, not in lieu of jquery.
That being said, this may not necessarily answer your question, except to say zeptoJs might be one such alternative. Again, Underscore/Lodash is not an alternative to but one or the other provides additional functionality (that in the long term will save file size.)
fwiw imho. 37k is not a valid arguments against jquery/lodash and other such tools. why?
1) If you serve your libraries from a cdn its not even a valid hit against the server.
2) These libraries help you write WAY SMALLER code.
In fact this claim sounds more like an excuse than a reason.
cheers.
I was wondering wether there is a way to attach eventlisteners to variables. The idea is to do something like this:
someVar.addEventListener('change', someTodo, false);
So once someVar is changed by i.e. someVar=1, someTodo would be executed.
I think to understand that - in theory - eventlisteners can be added to everything in the DOM, the problem beeing that variables do not trigger those events, while HTML objects DO trigger them.
If that is indeed correct, the extended question would be: How to train DOM objects to trigger events? I have read something about prototyping, is that the trick here?
Please note: I like to understand and write all of my code myself. So I'd rather be interested in the theory then using some existing thing like jQuery, where all sorts of miracles are baked right in.
Marco
The safe and time tested approach is to use getters and setters on your objects (ie, you only allow access to the variable through object methods like getX()/setX()). You could then have overload setX() to trigger callbacks. There are some languages like Lua and Python where access to an object's members can be caught with meta functions but I do not believe Javascript supports this in any way.