philipbeel/contactable — pull request #4 by chuckhoupt (2012-07-09 00:18:02+00:00)
Title: Fix for name conflicts due to generic class and id names

This fix is a bit more involved. The issue is class and id names like 'email', which are generic enough that sometimes host pages will use the same names.

I've actually seen this problem in the "wild", where a bit of code like $('#email').val() was working fine until Contactable was added to the page template and causes the code to silently return the empty string (because it is getting the value of Contactable #email, not the host page's #email).

Contactable protects itself from duplicate ids by using the double-id selector kludge (e.g. $('#contactable #email').val()), but this leaves the host page vulnerable. Also, Contactable is vulnerable to style changes due to generic class names like 'dropdown'.

You can see demonstrations of id and class name problems in the name.html file in the commit.

HTML/CSS has no package/namespace system, so the next best solution is to create a pseudo-namespace by prefixing classes and ids with 'contactable-'. This isn't perfect, but for all practical purposes it reduces the chance of a name conflict to nil. It also simplifies the code a little, since there is no longer a need for double-id selectors.

A side benefit of this change is that the requirement of a div with id 'contactable' is removed -- the plugin can be applied to any div.

I'm happy to answer questions or adjust the patch as needed.

Cheers - Chuck