Hi,

>  http://www.wiredphotographer.com/?s=new
> once you get there click on the "ADD / EDIT CATEGORIES" link in the
> bottom right

I'm not seeing that link.  It could be because of an error, I'm seeing
this where I'm guessing content would normally go:  "Unknown column
'b.userFirst' in 'field list'"  (It's very hard to see, it's in dark
grey on black.)

> Anyways where I have problems are with event observers, I am finding
> that I would almost have to have an indefinite loop of onComplete
> followed by new observers.
> Here is the javascript that I have been toying with:http://pastie.org/517240

It's not really a loop, is it?  It's just that when you're adding new
elements, you're then hooking up the events on them, which is
reasonable.

When you add new elements that you need to observe events on, there
are two fundamental approaches as far as I know:

1. Hook the events on the actual elements after you've added them.
This is useful in scenarios where, for instance, you've added a button
and you want to watch for it being clicked, or when you're hooking an
event that doesn't "bubble"[1].  (You can either do this manually, or
there are some plug-ins that let you give a CSS selector and will
automagically hook events whenever elements are added matching that
selector.)

2. Hook the event on an element that contains the elements you're
adding, and handle the event when it bubbles up to the container.
This is sometimes called "event delegation" and can be very, very
powerful and compact.  For example, say you have a table with 100 rows
of 20 cells that you retrieve via an Ajax call, and you want to know
when any of the cells is clicked.  Now, you _could_ hook the 'click'
event on all 2,000 cells, but there's a much easier way:  Hook the
click event on the tbody element (or the table element) containing the
rows instead.  You can still find out what element was actually
clicked via Prototype's Event#findElement[2] method.

[Arguably, a third approach is to have all of the elements already
present in the page, just hidden (via display: none).]

Here's a quick and dirty demo of using event delegation with
dynamically-added content:
http://pastie.org/517390
Click inside the cells (they have blue borders) and it shows you which
cell you clicked in; click within the table but outside of any cell
(between cells, or on a header) and it tells you you did that.  For
the table observation, only one handler is required, and yet it's very
easy to differentiate what was clicked within the table.  (Note I
observed the table element in this example; usually when doing this
I'd observe the tbody element, but I wanted to make it easy to click
within the observed element but outside of a cell.)

A parting note:  When you're removing an element and you've hooked an
observer on that element, be sure to call Element#stopObserving[3]
first to release the handler and the memory it's consuming.

[1] http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-flow-bubbling
[2] http://prototypejs.org/api/event/findElement
[3] http://prototypejs.org/api/element/stopObserving

HTH,
--
T.J. Crowder
tj / crowder software / com
Independent Software Engineer, consulting services available

On Jun 19, 4:19 am, "ph...@ryangibbons.net" <ph...@ryangibbons.net>
wrote:
> Hey all,
>
> I will preface this with the fact that I am a new user of both
> prototype and javascript, so I am learning (slowly) as I go.  I am
> currently working on a blog interface and I was going to use this as
> my opportunity to learn prototype and some more dynamic ways to handle
> form data.
>
> That all being said I am running into problems on a "Select
> Categories" form that toggles between being editable and used to
> select the categories that apply to a blog post.  The best way to
> describe it is to show it to you:http://www.wiredphotographer.com/?s=new
> once you get there click on the "ADD / EDIT CATEGORIES" link in the
> bottom right.  Please note this is a rough draft of the site so not
> everything is functional and the code might not yet be as tidy as it
> should be.
>
> Anyways where I have problems are with event observers, I am finding
> that I would almost have to have an indefinite loop of onComplete
> followed by new observers.
>
> Here is the javascript that I have been toying with:http://pastie.org/517240
>
> I know that it is not correct or "good" code and I know that the
> approach I am trying is probably fundamentally flawed.  So I am
> looking for someone that might be able to set me in the right direct.
>
> Thanks for all the help,
>
> Ryan
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups 
"Prototype & script.aculo.us" group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to 
prototype-scriptaculous+unsubscr...@googlegroups.com
For more options, visit this group at 
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~----------~----~----~----~------~----~------~--~---

Reply via email to