After sitting and thinking about it over lunch, that was my thinking,
too.

The purpose of classes is for styles/behaviors/identifiers that are
spread across multiple occurrences of an item.  (Full detail: I'm
working on this project with some PHP engineers at work, and they're
completely OK with using multiple DOM IDs on a page simply because "it
works" already, and they can access the IDs by being more specific
like "#area1 #service1" in their JavaScript hooks).  Going "classes-
only" with re-usable Services would work, but for some elements, an ID
becomes more important.  Case in point: input text boxes.  Generally,
they have a name and ID, but if two Services are loaded with the same
content, the IDs overlap -- and who knows what will break.

I'm against using duplicate IDs on any page just because I learned the
W3C standards and what's good practice and what's not.  Aside from
using classes as semi-unique identifiers, I can't see a way around the
dilemma...


On Sep 7, 12:38 pm, "Benjamin Sterling"
<[EMAIL PROTECTED]> wrote:
> Collin, You should be able to get away with using classes instead
> $('.service')  and you can grab each instance like (I could be wrong on this
> option) $('.service')[0] or $('.service')[1] or you can do
> $('service:eq(0)') and $('service:eq(1)') and then you have the slice method
> which is a little harder to explain, but is just like using the javascript
> slice method.
>
> On 9/7/07, Collin Allen <[EMAIL PROTECTED]> wrote:
>
>
>
>
>
> > I'm currently working on a project where different areas of the user
> > interface (an AJAX-loaded "Service") are intended to be re-usable,
> > potentially with more than one "instance" of a given Service on a
> > page.  The issue I'm running into, and am asking for some input on, is
> > the following:
>
> > When I load one instance of a Service into the page, there are DOM IDs
> > on a number of tags.  That's easy enough.  I can hook them with jQuery
> > all day long and everything is peachy.  However, when I load a second,
> > duplicate Service on the page into another area, the DOM IDs of the
> > two Services collide.
>
> > I can still hook elements with jQuery by being more specific $("#area1
> > #service") and $("#area2 #service"), but I realize this isn't valid
> > HTML.  I can't think of another solution, though.  Is there any way to
> > have a significant amount of content on a page that overlaps, but not
> > have their IDs collide, yet still offer "clean" CSS selectors and DOM
> > references for jQuery?  The Services also bring in their own
> > JavaScript, which is why each instance needs to be able to reference
> > itself, without getting only the first occurrence of an ID that exists
> > on a page.
>
> > I hope I'm being specific enough...  If not, I can surely provide a
> > small example.
>
> > Thanks once again!
>
> --
> Benjamin Sterlinghttp://www.KenzoMedia.comhttp://www.KenzoHosting.com

Reply via email to