jQuery also allows developers to make use of custom events. How it is going to help us, we are going to see it shortly. First let’s take a look at a basic calendar application.
Code looks like this.
In the above case we have four methods. If all the implementation is filled out and helper methods are added then ,in total, we’ll have tons of methods.
And slowly, it’ll become difficult to see which methods act on the main element monthly_calendar_umbrella.
Let’s look at the same functionality if implemented using jQuery custom events.
First difference, you will notice is how nicely all the actions possible on the main element are laid out. In this case just one look at the code tells me that four actions can be performed on the main element. This was not so obvious from the first version of the code.
In this case, I am binding events such as ‘redrawFroMonth’ to the element. Obviously ‘redrawForMonth’ is not a native event such as ‘click’ or ‘submit’. This is what I mean by binding ‘custom events’ to elements. In this case ‘redrawForMonth’ is a custom event.
Now, the last part of the discussion is how to trigger custom events. Well, jQuery has a method called trigger .
Note that while binding a function is passed. The first parameter of that function is always an event handler. In the below example I am passing only one parameter even though the function takes two parameters: event handler element and the parameter I defined.
Let’s say that I have bound all the links to display an alert.
However it would be cool if there is a way to find all the click handlers associated with an element.
jQuery has data method which it uses internally to store information. jQuery uses data method to store all the handlers associated with an element. We could use this information to our advantage. Here I am trying to find out all the click handlers associated with the first link.
The output looks like this
jQuery.data method is also very useful if you want to store some information about an element. For example, in an application you need to store information about people. In the html page you are only displaying names. And when a name is clicked then you want to display age, hometown and the company they work for. You can store information about each user using jQuery.data and you can retrieve it when user name is clicked.
When you click on Java then you will get two alerts. That is because the click on element p will propagate outward and it will be caught by element div which has onclick trigger.
If you do not want the event to propagate then here is a way to stop it.
Stopping the default behavior
Converting a regular html link into an AJAX request is easy. One of the things you need to do is to return false so that the click operation does not perform its default behavior.
However there is another way to handle such cases. preventDefault stops the default behavior. The same code could be written as
In order to get around this security problem you can do any number of things including sending the Ajax request to your server which will get the JSON data from the eventsinindia.com API. Or use iframe. Both of these solutions are implemented and discussed in this article .
However in some cases JSONP solves this problem much more elegantly.
Before we discuss JSONP some basics ?
When the html page is loaded you will get an alert.
What is JSONP?
All the APIs should provide support for JSONP. Enabling JSONP support is easy if you are using Rails 2.3 or any Rack compliant framework. In Rails 2.3 all you need to do is stick this file in lib as jsonp.rb and then add one line to the environment.rb .
That’s it. Now you are providing support of JSONP with the keyword being callback.
I was hoping that I will get a dot after every two seconds. But that’s not what happens when you run the code. I see nothing for first 10 seconds then I see five dots in one shot. This is not what I wanted.
I started looking around at the documentation for IO class and found the method called sync= which if set to true will flush all output immediately to the underlying OS.
The reason why OS does not flush immediately is to minimize the IO operation which is usually slow. However in this case you are asking OS to not to buffer and to flush the output immediately.
Before you look at the next piece of code remember that defining a variable without the var prefix makes that variable a global variable.
What do you think would be the alert value first time? I thought it would be Angelina but the correct answer is undefined. That is because it does not matter where the variable is defined. As long as the variable is defined anywhere within a function then that variable will be set to undefined. It is when the statement is executed then the value of the variable changes from undefined to Jennifer.
What are we talking about
You can see that the main method that I want to expose to global namespace is showCalendar. However I am also exposing six other functions to global namespace. It means that if some user has declared a global namespace function named getCellID then my getCellID is going to collide with the user’s function. This is not good.
The above call to getCellID is currently being executed successfully. It means I have polluted the global namespace. I am going to fix it.
The solution is to put all the code inside a function. In a function all the variables and functions declared are scoped only to that function. Out of that function, inner functions cannot be used. Inside this function only one method showCalendar would be exposed.
Here is the solution.
In the above case the call to showCalendar was successful. However call to getCallID failed. That’s good. It means I am not polluting the global namespace.
If you notice carefully in the above case after declaring an anonymous function I am invoking that function by having () at the end. You can read more about self-invoking function here .
Example 1: Getting digit name
The goal is to read from an array and display the result. The first implementation is to put everything in Global namespace.
Above solution works. However creating a global variable names is not a good thing. You should create as less global variables as possible.
Moving to a function
Next step is to move the code to a function. In this case we will not have any global variable.
The above solution is very slow. Every single time the function is called the whole array is loaded. This solution works and most of the developers will settle with this one. However Closure can provide a better solution.
Better solution with Closure
Note that at after declaring the function the function is also getting invoked. This is a case of self invoking function. You can find out more about self invoking function here .
Example 2: Getters and Setters
Developers deal with getters and setters all the time. However creating a good getter and setter could be a little tricky. Here is one implementation
Above solution works and it’s nicely done.
Let’s look at another implementation.
This is a simple case of serially iterating through the items provided but the logic of deciding next element can be complex and it can be private.
I am learning jQuery and one of things I was struggling with is the plugin pattern. In jQuery world it is very common to wrap the major functionality of the application inside a plugin.
Here is a great article
The article did a great job of explaining the basics however it took me a while to understand the self-invoking functions.
self-invoking functions are anonymous functions declared on run time and then invoke it right then and there.
Since they are anonymous functions they can’t be invoked twice.
However they are a good candidate for initialization work which is exactly what is happening in the jQuery plugin pattern.
Declaring a function
A function can be declared in two ways:
In the end a variable named hello was created which is a function.
Please note that in the above case only the functions are declared. They are not invoked. In order to invoke the function we have to do this
How do we invoke an anonymous function. We need to call () on the anonymous function. But before that we need to wrap the whole command in (). Take a look at this
The final result is weird looking code but it works and that is how an anonymous function is declared and invoke on run time.
With this understanding now it becomes easier to see what is happening in this code
In the above case an anonymous function is being created. However unlike my anonymous function this anonymous function take a parameter and the name of this paramter is $. $ is nothing else but jQuery object that is being passed while invoking this function.
Rails makes it easy to adapt Restful architecture. All you have to do is following.
I started putting all pictures related activities in pictures_controller.rb .
In the beginning it was simple.
Slowly the application evolved.
The application started handling two different types of pictures.
There would be pictures for events and then there would be pictures of users using the system.
One can add comments to the event pictures but one can’t add comment to user pictures.
Slowly the requirement for event pictures grew vastly different from user pictures.
Sounds familiar. Right.
Initially controller takes on a few responsibilities but
slowly the controller starts taking a lot more responsibilities and then controller becomes huge.
The pictures controller was really huge and was fast becoming a mess and
specially writing test was getting very difficult.
Time had come to create two different controllers: one for event pictures and one for user pictures.
But wait. Lots of people would say that if we want to be restful then
there has to be one to one mapping between the model and the controller.
Model != resource
Being restful does not mean that there has be a one to one mapping between the model and the controller.
I am going to create a new controller called user_pictures_controller.rb
which will take on all the functionality related to users dealing with picture.
And this is going to be restful.
Above I have defined a resource called user_pictures.
To keep it simple this controller would do only three things.
display all the pictures of the user ( index )
allow user to upload pictures ( create )
allow user to delete a picture ( destroy )
That’s the general idea. In my application I have only three actions.
However in the interest of general discussion
I am going to show all the seven methods here.
Also for simplicity create in this case means adding a record (I am not showing multipart upload).
Here is the code for controller.
Another use case
Let’s talk about another example.
Let’s say that we have a model called Project
besides the regular functionality of creating, deleting, updating and listing projects,
one needs two more actions called enable and disable project.
Well the projects controller can easily handle two more actions called “enable” and “disable”.
However it is a good idea to create another controller called project_status_controller .
This controller should have only two actions - create and destroy.
destroy in this case would mean disabling the project
create would mean enabling the project.
I know it looks counter intuitive. Actions ‘enable’ and ‘disable’
seem simpler than “create” and “destroy”.
I agree in the beginning adding more actions to pictures controller looks easy.
However if we go down that path then it is a slippery slope and we do not know when to stop.
Compare that with the RESTful design of having only seven action : index, show, new, edit, create, update, destroy.
This limits what a controller can do and that’s a good thing.
This ensures that a controller does not take up too many responsibilities.
Creating another controller allows all the business logic which is not related to one of those
seven actions to be somewhere else.
One last example
Now that we have the ability to “enable” and “disable” pictures how about showing “only active”,
“only inactive” and “all” pictures.
In order to accomplish it once again we can add more actions to the pictures controller.
However it is much better to have two new controllers.
Some of you must be thinking what’s the point of having a controller for the sake
of having only one action.
Well the point is having code that can be changed easily and with confidence.
In this blog I tried to show that it is not necessary to have one to one mapping between model and controllers to be restful.
It is always a good idea to create a separate controller when the existing controller is burdened with too much work.
Rails exception handling depends on two factors and we are going to discuss both of them here.
When exceptions are handled by rescue_action_locally then we get to see the page with stacktrace. When exceptions are handled by rescue_action_in_public, we get to see the public/500.html or an error page matching the error code.
As you can see Rails uses two different methods consider_all_requests_local and local_request? to decide how exception should be handled.
consider_all_requests_local is a class level variable for ActionController::Base . We hardly pay attention to it but it is configured through files residing in config/environments
As you can see in development environment all the requests are considered local.
I have overridden the method local_request? but I am still not able to see public page when exception is raised.
That is a common question I see in the mailing list. As you can see the condition to decide how to handle exception is
In development environment consider_all_requests_local is always true as I showed before. Since one of the conditions is true Rails always handles the exception using rescue_action_locally .
I am running in production mode but I am still not able to see public/500.html page when I get exception at http://localhost:3000.
Same issue. In this case you are running in production mode so consider_all_requests_local is false but local_request? is still true because of localhost.
I want local_request? to be environment dependent
Recently I started using hoptoad and I needed to test how hoptoad will handle exception in production mode. However without any change local_request? was always returning true for http://localhost:30000 .
Then I stick following file under config/initializers
Now all request in production or in staging mode are treated as NOT local.
Now in both staging and production mode I get to see 500.html page even if I am accessing the application from http://localhost:3000 .
Rails provides some good tools like automatically updating created_at and updated_at columns. Developers do not need to worry about these columns. Rails updates these columns automatically which is great. Click here to find out how rails does auto time stamping.
However I have a unique business need where I need to update a column but I do not want updated_at to be changed. Or we can see the problem this way. I want to change the updated_at to a particular value.
Look at the sql that is generated. Rails discarded the updated_at value that I had supplied and replaced the value by the current time. Rails works fine if you supply created_at value. It is the updated_at value that is discarded.
It worked. I have successfully set updated_at to year 1909. However there is a problem.
For a brief duration User.record_timestamps was set to false. That is a class level variable. It means that for that brief duration if any other User record is updated then that record will not have correct updated_at value. That is not right. I want just one record ( User.first) to not to change updated_at without changing the behavior for the whole application.
In order to isolate the behavior to only the record we are interested in, I can do this.
In order to restrict the changes to a model, I am opening up the metaclass of u ( user object) and in that object I am adding a method called record_timestamps . The idea is to insert a method called record_timestamps in the metaclass which will return true and in this way the changes are restricted to a single object rather than making change at the class level.
At this point the meta class of the user object has the method record_timestamps and this returns false. Now I update the record with updated_at set to 100 years ago. And I succeed.
Now I need to put the object behavior back to normal. I open up the metaclass and call super on the method so that the method call will go up the chain. And that’s what happens when I try to test updated_at. This time the updated_at value that I set is ignored and rails changes the updated_at value.
This strategy of opening up an instance object works but it is messy. I would like to have a method that is much easier to use and this is what I came up with. Stick this piece of code in an initializer.
This is how you can use it.
Good usage of remove_method
In the above solution I used super when I want to bring back the default auto time stamping behavior. In stead of super I can also use remove_method. More about the what remove_method does is here .
Using the above technique, I can fully control updated_at values without rails messing up anything.
Following code was tested with ruby 1.8.7 and Rails 2.x .
Rails recently added named_scope feature
and it is a wonderful thing.
If you don’t know what named_scope is then you can find out more about it
This article is not about how to use named_scope.
This article is about how named_scope does what it does so well.
ActiveRecord has something called with_scope which is not associated with named_scope.
The two are entirely separate thing.
However named_scope relies on the workings on with_scope to do its magic.
So in order to understand how named_scope works first let’s try to understand what with_scope is.
with_scope let’s you add scope to a model in a very extensible manner.
We can see that when User.all_male is called, it internally calls all_active method
and the final sql has both the conditions.
with_scope allows nesting and all the conditions nested together are used to form one single query.
And named_scope uses this feature of with_scope to form one single query from a lot of named scopes.
Writing our own named_scope called mynamed_scope
The best way to learn named_scope is by implementing the functionality of named_scope ourselves.
We will build this functionality incrementally.
To avoid any confusion we will call our implementation mynamed_scope.
To keep it simple in the first iteration we will not support any lambda operation.
We will support simple conditions feature. Here is a usage of mynamed_scope .
We expect following queries to provide right result.
Let’s implement mynamed_scope
At the top of user.rb add the following lines of code
Now in script/console if we do User then the code will not blow up.
Next we need to implement functionalities so that mynamed_scope creates class methods like active and male.
What we need is a class where each mynamed_scope could be stored.
If 7 mynamed_scopes are defined on User then we should have a way to get reference to all those mynamed_scopes.
We are going to add class level attribute myscopes which will store all the mynamed_scopes defined for that class.
This discussion is going to be tricky.
We are storing all mynamed_scope information in a variable called myscopes.
This will contain all the mynamed_scopes defined on User.
However we need one more way to track the scoping. When we are executing User.active then the active mynamed_scope should be invoked on the User. However when we perform User.male.active then the mynamed_scope active should be performed in the scope of User.male and not directly on User.
This is really crucial. Let’s try one more time. In the case of User.active the condition that was supplied while defining the mynamed_scopeactive should be acted on User directly. However in the case of User.male.active the condition that was supplied while defining mynamed_scopeactive should be applied on the scope that was returned by User.male .
So we need a class which will store proxy_scope and proxy_options.
Now the question is when do we create an instance of Scope class. The instance must be created at run time. When we execute User.male.active, until the run time we don’t know the scope object active has to work upon. It means that User.male should return a scope and on that scope active will work upon.
So for User.male the proxy_scope is the User class. But for User.male.active, mynamed_scope ‘active’ gets (User.male) as the proxy_scope.
Also notice that proxy_scope happens to be the value of self.
Base on all that information we can now write the implementation of mynamed_scope like this.
At this point of time the overall code looks like this.
What we get is an instance of Scope. What we need is a way to call sql statement at this point of time.
But calling sql can be tricky. Remember each scope has a reference to the proxy_scope before it. This is the way all the scopes are chained together.
What we need to do is to start walking through the scope graph and if the previous proxy_scope is an instance of scope then add the condition from the scope to with_scope and then go to the previous proxy_scope. Keep walking and keep nesting the with_scope condition until we find the end of chain when proxy_scope will NOT be an instance of Scope but it will be a sub class of ActiveRecord::Base.
One way of finding if it is an scope or not is to see if it responds to find(:all). If the proxy_scope does not respond to find(:all) then keep going back because in the end User will be able to respond to find(:all) method.
Now in script/console you will get undefined method find. That is because find is not implemented by Scope.
Let’s implement method_missing.
Statement User.active.male invokes method ‘male’ and since method ‘male’ is not implemented by Scope, we don’t want to call proxy_scope yet since this method ‘male’ might be a mynamed_scope. Hence in the above code a check is done to see if the method that is missing is a declared mynamed_scope or not. If it is not a mynamed_scope then the call is sent to proxy_scope for execution. Pay attention to with_scope. Because of this with_scope all calls to proxy_scope are nested.
However Scope class doesn’t implement with_scope method. However the first proxy_scope ,which will be User in our case, implements with_scope method. So we can delegate with_scope method to proxy_scope like this.
At this point of time the code looks like this
Let’s checkout the result in script/console
named_scope supports a lot more things than what we have shown. named_scope supports passing lambda instead of conditions and it also supports joins and extensions.
However in the process of building mynamed_scope we got to see the workings of the named_scope implementation.
Following code was tested with ruby 1.8.7 and Rails 2.3 .
While developing rails application you have must seen this
We all know that this message is added by Rails and it is called whiny nil .
If you open your config/development.rb file you will see
Simply stated it means that if the application happens to invoke id on a nil object then throw an error.
Rails assumes that under no circumstance a developer wants to find id of
a nil object. So this must be an error case and Rails throws an
The question I have is why 4.
Why Matz chose the id of nil to be 4.
This awesome presentation
on ‘Ruby Internals’ has the answer.
In short Matz decided to have all the odd numbers reserved for numerical values.
Check this out.
Id 1,3,5 and 7 are taken by 0,1,2 and 3.
Now we are left with the id 0,2,4 and higher values.
FALSE had the id 0 and TRUE has the id 2.
Now the next available id left is 4 and that is taken by NIL.
We won’t even be discussing this issue once 1.9 comes out
where we will have to use object_id and then this won’t be an issue.
You can follow more discussion about this article at
Hacker news .