Thanks Ricardo. I have put the code up at http://jsbin.com/atiza

As for the double quotes on the Velocity call, those are evaluated on
the server prior to being sent to the client, so no worries there.

I appreciate the help with this! It seems like this should be a very
easy thing to do (I did the exact same thing with Prototype/
Scriptaculous on another site). I am not sure what I am missing.



On Nov 5, 7:27 am, ricardobeat <[EMAIL PROTECTED]> wrote:
> Try providing a test page or pasting your code 
> atwww.pastie.orgorwww.jsbin.com, that way people can actually read it! :)
>
> Can't figure out from this code what might be wrong, it's probably an
> event bubbling issue.
>
> And you have src="$content.getURI("images/icon_plus.gif")" that will
> cause serious parsing errors on the browser, use single quotes inside.
>
> - ricardo
>
> On Nov 4, 7:43 pm, "[EMAIL PROTECTED]" <[EMAIL PROTECTED]> wrote:
>
> > Hi all.
>
> > I have an outer div that contains several child divs (event search
> > form that lets the user pick dates, categories, etc...). The user can
> > toggle the outer div and the child divs as well. This all works for me
> > AS LONG AS the outer div is visible and not able to be toggled. When I
> > let the user toggle the outer div, when the outer div is toggled to
> > visible and the user tries to toggle a child div, the child div opens
> > and then closes again right away.
>
> > I believe this is happening because the child div is somehow
> > inheriting the parent's visibility. I debugged it and
> > showHideExactDates() is being run twice. So, it seems like it is
> > starting out as visible, even though it is not visible on the form.
>
> > Here is a snippet of the code:
>
> > <p><a href="javascript:void(0)" id="searchFormShowHideLink_image"><img
> > src="$content.getURI("images/icon_plus.gif")"
> > name="searchFormShowHideIcon" id="searchFormShowHideIcon" border="0"
> > align="left" alt="+" /></a> <strong><a href="javascript:void(0)"
> > id="searchFormShowHideLink_text">Search Form</a></strong></p>
>
> > <div id="eventSearchFormDiv">
> >   <p><a href="javascript:void(0)" id="dateExactShowHideLink_image"
> > title="show/hide exact date form fields"><img
> > src="$content.getURI("images/icon_plus.gif")"
> > name="dateExactShowHideIcon" id="dateExactShowHideIcon" border="0"
> > align="left" alt="+" /></a> <a href="javascript:void(0)"
> > id="dateExactShowHideLink_text">Specify Exact Dates</a></p>
> >         <div id="dateExactDiv" style="display: none;">
> >             Occurs between <input type="text" size="3"
> > name="dateRangeStartMonth" id="dateRangeStartMonth" title="date range
> > start month" value="$!dateRangeStartMonth" maxlength="2">/
> >             <input type="text" size="3" name="dateRangeStartDay"
> > id="dateRangeStartDay" title="date range start day" value="$!
> > dateRangeStartDay" maxlength="2">/
> >             <input type="text" size="5" name="dateRangeStartYear"
> > id="dateRangeStartYear" title="date range start year" value="$!
> > dateRangeStartYear" maxlength="4"><a href="javascript:void(0)"
> > id="dateRangeStartCalendarLink" title="event range start calendar date
> > picker"><img src="$content.getURI("images/icon_calendar.gif")"
> > alt="Choose range start date" border="0" align="absmiddle"></a>&nbsp;
> >                 and <input type="text" size="3" name="dateRangeEndMonth"
> > id="dateRangeEndMonth" title="date range end month" value="$!
> > dateRangeEndMonth" maxlength="2">/
> >                 <input type="text" size="3" name="dateRangeEndDay"
> > id="dateRangeEndDay" title="date range end day" value="$!
> > dateRangeEndDay" maxlength="2">/
> >                 <input type="text" size="5" name="dateRangeEndYear"
> > id="dateRangeEndYear" title="date range end year" value="$!
> > dateRangeEndYear" maxlength="4"><a href="javascript:void(0)"
> > id="dateRangeEndCalendarLink" title="event range end calendar date
> > picker"><img src="$content.getURI("images/icon_calendar.gif")"
> > alt="Choose range end date" border="0" align="absmiddle"></a>
> >         </div>
> > </div>
>
> > function showHideSearchForm() {
> >         jq("#eventSearchFormDiv").toggle("blind", {}, 1000);
> >     }
>
> >     //add the form submit handler
> >     jq(document).ready(function() {
> >         jq("#searchFormShowHideLink_image").click(showHideSearchForm);
> >         jq("#searchFormShowHideLink_text").click(showHideSearchForm);
> >     });
>
> > function showHideExactDates() {
> >         alert("running showHideExactDates()");
> >         jq("#dateExactDiv").toggle("blind", {}, 1000);
> >     }
>
> >     //add the form submit handler
> >     jq(document).ready(function() {
> >         jq("#dateExactShowHideLink_image").click(showHideExactDates);
> >         jq("#dateExactShowHideLink_text").click(showHideExactDates);
> >         jq("#dateRangeStartCalendarLink").datepicker();
> >         jq("#dateRangeEndCalendarLink").datepicker();
> >     });
>
> > Help please! I have been banging my head on this now for several
> > hours!
>
> > Thanks.

Reply via email to