Learned about the :hidden filter today

It seems that the more I dig into jQuery the more I realize how vast a library it is.   Also noticed that much of the CSS3 stuff is bleeding off into jQuery territory, but that is a topic for a different day.

I am currently reading the book jQuery in Action.  I am only in Chapter 2 and I've been reading it for about two weeks... sigh.  That should give you an idea of how long it's taking me to tackle the jQuery topic.

The topic of this post is to demonstrate how with my new knowledge of the ':hidden' filter I was able to reduce some code.

I basically went from multiple methods and dynamically adding a CSS class to the latter example marked 'TO simply this' below.


//From this
var checkIfIsExpanded = function(){
                                       
                                if(  $(this)
                                    .parents(".log_entry")
                                    .children(".popup_details")
                                    .is('.expanded'))
                                {
                                        return false;
                                }
                               
                                return true;
                            }

var setExpandedClass = function(){
           
                                $(this)
                                .parents(".log_entry")
                                .find(".popup_details")
                                .addClass("expanded");
                               
                            }
                           
 var removeExpandedClass = function(){
                               
                                    $(this)
                                    .parents(".log_entry")
                                    .children(".popup_details")
                                    .removeClass("expanded");
                            }

//TO simply This
var checkIfIsExpanded = function(){
                                       
                                if(  $(this)
                                    .parents(".log_entry")
                                    .children(".popup_details")
                                    .is(':hidden'))
                                {
                                        return false;
                                }
                               
                                return true;
                            }


I was using the concept of adding a class at run time ('.expanded') to allow me to determine if a particular element was visible.  Whenever I expanded the class (made it visible), I would add a classs to show it was expanded.  Then whenever I hid it I would remove the class.  Well jQuery has an easier way to determine if something is visible or not.  Enter the ':hidden' filter.   With that I was able to remove the two methods for adding and removing the .expanded class and also to know call those methods in my code.

That is all I have today.  You can see the progress on the website as soon as I update the website with this change at:   http://followmetotheweb.apphb.com.

As a disclaimger I also want to point out that I learned about using underscores in my class names.  The short story is "DONT DO IT". In other words don't name your class class='my_class'.  Name your class like this instead class='my-class'.  You should use hyphens instead.  Hyphens allow for special CSS and jQuery filters.  I don't have my notes in front of me but trust me they do.

Until Next Time.  Happy coding.










Comments

Post a Comment

Popular posts from this blog

Putting Files on the Rackspace File Cloud

Recently, I’ve been playing around with Asp.Net MVC and I (along with some friends) am creating an Asp.Net MVC application that can access files from our website. This means that files must display on the site as well as provide a way to download/upload them. I won’t give away all the details of the project but I will say this: Sharing photos is one of the driving forces for our project.  The files are only image type files( jpg, etc) The files must be uploaded by the users and stored somewhere within our system.  We don’t necessarily know at this time how much storage space we need but we think that we will need a little at first but possibly a lot more down the road. This means that the storage of these files must be scalable. The uploading of files must be controlled by our system.  Right off the bat we started our application and were uploading files to the web server with no problem.  We only did it this way to kind of prove our system model. We wer...
Read more

Setting Up XnaMobileUnit to run unit tests in Windows Phone 7 XNA Games

Image
Introducing XnaMobileUnit I decided to roll my own unit test framework for Windows Phone 7 XNA games.   I have a couple of reasons why I decided to roll my own.  Among them was the fact that you cannot reference regular .Net assemblies from Windows Mobile Framework.  That means that referencing NUnit was out of the question.  Also using some of the other libraries that can be used for Silverlight Applications didn't quite feel right for me. The framework that I have created, XnaMobileUnit, is very simple to use and provides all the necessary functionality to run unit tests.  I am still working on the framework to provide a few more capabilities and features, but for the most part it is ready to use out of the box.  XnaMobileUnit is open source licensed under the Apache 2.0 License and can be downloaded from http://code.google.com/p/xna-mobile-unit/ .  I recommend downloading the latest source and compiling it then referencing the new DLL. Othe...
Read more

Reasons to Stay Away from CSLA

We've been using CSLA - Component-based Scalable Logical Architecture in a product for approximately one year and while it solves quite a few problems it violates some major good practices. No Clear Separation of Layers While at the time that we chose CSLA we knew very little about domain driven design, it is no excuse for the framework to possess the data access layer within the business object. This makes it extremely difficult to separate the concerns. As a result, it is difficult to mock the data-access layer creating many problems when attempting to perform unit tests. This also puts the additional responsibility of data access on the business object class, violating the Single Responsibility Principle( SRP ). Data access layer should be totally separated from the business object period. Having the data access within the within the BO class is not the only additional responsibility placed on the class but is the most significant one I can think of. No Context Validation...
Read more