Hello Kris,

Thank for you answer.
I tried what you suggested but I couldn't get it to work.
When a checkbox is clicked it look like there is a HTTPXMLRequest but the
listener in Tapestry is not fired.

But I did get it to work by changing the EventListener:

@EventListener(elements = "conceptFilter", events = {"onchange"},
submitForm="testForm", async=true)
   public void watchText(BrowserEvent event)
   {
//do things
}

And the id's of the checkboxes should start with the same id as the
surrounding DIV for it to work.
Don't know why it works like this, magic?

<span jwcid="[EMAIL PROTECTED]" >
<div id="checkboxes">
  <SPAN jwcid="@For" source="ognl:listCheckBoxes" value="ognl:checkId">
         <input jwcid="@Checkbox" id="ognl:'checkboxes_'+checkId"
value="ognl:checkboxValue"/>
  </SPAN>
</div>
</span>


Regards,
Diego



On 2/13/07, Kristian Marinkovic <[EMAIL PROTECTED]> wrote:

hi diego,

the simplest way is to add an EventListener to the parent node of the
checkboxes
add to take advantage of the javascript event model (event bubbling, event
delegation).

... lets say you are enclosing your checkboxes with a DIV tag

<div id="checkboxes">
      //for loop for checkboxes
</div>

in your page class you write something like this:

@EventListener(events = { "onclick" }, targets="checkboxes")
public void doSometing(BrowserEvent event) {
}

Any time the checkboxes are clicked on ("onclick") the event will bubble
up
the
DOM tree and notify every node of its occurance. If the node contains an
"onclick"
event listener it will be called. An Event object will be passed over to
the event
listener (in IE its a bit different:)). This object knows what event
occured and exactly
on which node (... in this case the checkboxes)

The EventListener javacript code analyses this event and passes it through
the
EventTarget object to the page class. The EventTarget is contained within
the
BrowserEvent object. As we cannot send the DOM node it will send us the id
of the DOM node (if present) back to the page class where we can use it to
trigger
a action.

it is important to check if the sent id really originates from the
checkboxes (id prefix)
because other nodes within the div may send "onclick" events too.

i hope this helps....

this technique may also be used to add EventListener to elemetns within a
loop!

read more on Events as www.quirksmode.org


greetings,
kris







             Diego
             <[EMAIL PROTECTED]
             com>                                                       An
                                        "Tapestry users"
             12.02.2007 16:23           <users@tapestry.apache.org>
                                                                     Kopie

              Bitte antworten                                        Thema
                    an                  For loop with checkboxes that use
             "Tapestry users"           ajax
             <[EMAIL PROTECTED]
                pache.org>








Hello,

I am starting to use Tapestry 4.1.1 and want to build a filter with
checkboxes that filters a result list.
The checkboxes are being generated from a list and when a checkbox is
checked a list is filtered by means of a Ajax call.
After that the results in the div with id=SearchResults is updated.

Is there someway to use the @EventListener for this? Because beforehand
don't know how many check boxes there will be.

Below is an example template:

            <SPAN jwcid="@For" source="ognl:listCheckBoxes"
value="ognl:checkId">

                <input jwcid="@Checkbox" id="ognl:checkId"
value="ognl:checkboxValue"/>

            </SPAN>

          <div class="SearchResults" id="SearchResults">
              <table>
                <tr jwcid="[EMAIL PROTECTED]" source="ognl:foundList"
value="ognl:foundItem" element="tr">
                    <td>
                        <table>
                            <tr>
                                <td>
                                    <span jwcid="@Insert"
value="ognl:concept"/>
                                </td>
                            </tr>
                           </table>
                    </td>
                </tr>
             </table>
         </div>

Regards,
Diego



---------------------------------------------------------------------
To unsubscribe, e-mail: [EMAIL PROTECTED]
For additional commands, e-mail: [EMAIL PROTECTED]


Reply via email to