On 8/9/07, syg6 <[EMAIL PROTECTED]> wrote:
>
> Howdy Matt,
>
> Well, if I comment out scriptaculous I get two errors:
>
> >form.findFirstElement is not a function
> >form.findFirstElement().activate();
>
> >Effect is not defined
> >new Effect.Highlight('successMessages');
>
> The first one is because of the Form.focusFirstElement() line at the bottom
> of the page, and the second one is because of the validation success
> messages. Both errors appear because scriptaculous is commented out. Rather
> than get rid of this functionality I wanted to find out how to get
> scriptaculous and jquery to 'play nice'.
>
> After chatting with some guys over on the jQuery mailing list I discovered
> it's quite easy. After importing jQuery you simply run the following line:
>
> jQuery.noConflict();
>
> This tells jQuery that it cannot use the '$' which other libraries, like
> scriptaculous, use. And then with any jQuery command, instead of using:
>
> $(function()
> {
> $('.date-pick').datePicker();
> }
>
> you use:
>
> jQuery(function()
> {
> jQuery('.date-pick').datePicker({clickInput:true});
> });
>
>
> You can also tell jQuery to use a different short-name instead of '$':
>
> var $j = jQuery.noConflict();
> $j(function()
> {
> $j('.date-pick').datePicker();
> }
>
> My calendar / datePicker is now working.
This is good stuff to know. This might be good information to add to
the FAQ or Ajax Reference Guide on the wiki.
>
> I still have a css problem though. The jQuery datePicker has its own css,
> and Appfuse seems to be picking it up - the fonts are correct at least. But
> the calendar pops up in the bottom-left-hand corner of the screen and is
> missing a bunch of styles - some cells should be grey, others black,
> roll-over should highlight current cell, etc.
>
> According to the Appfuse tutorial, if you want to use custom css you have to
> add
>
> <body id="pageName"/>
>
> to your jsp and then add
>
> body#pageName element.class { background-color: blue }
>
> to your own css. The css for datePicker has some lines like:
>
> table.jCalendar
> table.jCalendar th
>
> to which I theoretically add:
>
> table.jCalendar#pageName
> table.jCalendar th#pageName
>
Actually, you'd want to do:
#pageName table.jCalendar
Using body#pageName is optional - it's just a way of narrowing the CSS selector.
> Not too sure. But the same css also already has lines like:
>
> div#dp-popup
> a#dp-close:hover
>
> How the heck would I add the '#pageName' if these lines already have
> '#db-popup'?
#pageName div#dp-popup
>
> Something tells me that I don't need to add the body tag with id. Appfuse is
> correctly rendering some of the styles, so it must be finding the css ok. It
> just seems to be ignoring some styles, and positioning.
>
> Any idea what the cause could be? Css collisions? Global warming?
It's probably the generic table styles in typo.css of the them you're
using. You might try commenting them out. Here's the ones from
simplicity:
table {
font-size: 1em;
margin: 0 0 1.5em 0;
padding: 0;
}
table caption {
font-weight: bold;
margin: 0 0 0 0;
padding: 0 0 1.5em 0;
}
th {
font-weight: bold;
text-align: left;
}
td {
font-size: 1em;
}
HTH,
Matt
>
> Thanks Mr. Matt,
> Bob
>
>
>
> mraible wrote:
> >
> > I haven't used jquery, so I don't have any advice for you. However, I
> > do believe you should be able to use it w/o scriptaculous, so I don't
> > know why you'd need to include them both. I'd suggest trying to get
> > things to work in a standalone HTML page (outside of AppFuse). Once
> > you have that working, turn it into a JSP page and get it working
> > inside of AppFuse (possibly w/o SiteMesh involved at first).
> >
> > Baby steps should help you solve the problem.
> >
> > Matt
> >
> >
> > On 8/8/07, syg6 <[EMAIL PROTECTED]> wrote:
> >>
> >> Howdy.
> >>
> >> Anyone ever successfully used the
> >> http://kelvinluck.com/assets/jquery/datePicker/v2/demo/index.html jQuery
> >> datePicker with appfuse? Lemme tell you a story:
> >>
> >> In default.jsp, the page that 'decorates' all of your jsps, you have the
> >> following js libraries:
> >>
> >> prototype.js
> >> scriptaculous.js
> >> global.js
> >>
> >> In order to use datePicker you need the following js libraries:
> >>
> >> jquery-1.x.js
> >> date.js
> >> jquery-dimensions.js
> >> jquery-datepicker.js
> >>
> >> Hunky-dory. Now, I don't want to put those last 4 js files in default.jsp
> >> because I only need them in those jsps that have a date field. So I put
> >> them
> >> in my test.jsp file. But when appfuse renders my test.jsp page, including
> >> all the stuff in default.jsp, Firefox goes berserk. I get thousands of js
> >> errors, all in effects.js:
> >>
> >> >this._base has no properties, http://localhost:8080/scripts/effects.js,
> >> Line 516
> >>
> >> This also happens if I put my jquery.js in default.jsp after
> >> scriptaculous.js. However, if I put it before scriptaculous.js I get no
> >> errors. But my calendar doesn't work! No errors, just doesn't appear!
> >>
> >> And if I comment out scriptaculous.js in default.jsp, and leave jquery.js
> >> in
> >> test.jsp, my calendar works. I get a couple errors, because a couple
> >> scriptaculous functions are called automatically (focus, etc.) and fail
> >> because scriptaculous is commented out. But the calendar works. Oddly
> >> enough, the calendar appears in the bottom left corner of the screen and
> >> without any styles. It seems it's not grabbing either the datepicker.css
> >> or
> >> demo.css it needs, I don't know.
> >>
> >> Anyone ever used datePicker, or more generally, scriptaculous + jquery? I
> >> can't believe they can't work together, seeing as they are both becoming
> >> 'standards'. But it does seem that the order you put them in your page is
> >> important. It seems like if you put jquery after scriptaculous it goes
> >> into
> >> a loop, when jquery's constructor is called, and never exits.
> >>
> >> Incidentally, I realize that appfuse comes with a calendar.js but that
> >> code
> >> has been around forever and doesn't seem as customizable as jquery.
> >> Anyway,
> >> everyone seems to advocate jquery these days so I decided to jump in with
> >> both feet. So far all I got for my troubles is ... wet feet.
> >>
> >> Thanks!
> >> Bob
> >>
> >>
> >>
> >> --
> >> View this message in context:
> >> http://www.nabble.com/jQuery-%2B-scriptaculous-%2B-datePicker-%3D-frustration-tf4234825s2369.html#a12048975
> >> Sent from the AppFuse - User mailing list archive at Nabble.com.
> >>
> >> ---------------------------------------------------------------------
> >> To unsubscribe, e-mail: [EMAIL PROTECTED]
> >> For additional commands, e-mail: [EMAIL PROTECTED]
> >>
> >>
> >
> >
> > --
> > http://raibledesigns.com
> >
> > ---------------------------------------------------------------------
> > To unsubscribe, e-mail: [EMAIL PROTECTED]
> > For additional commands, e-mail: [EMAIL PROTECTED]
> >
> >
> >
>
> --
>
> View this message in context:
> http://www.nabble.com/jQuery-%2B-scriptaculous-%2B-datePicker-%3D-frustration-tf4234825s2369.html#a12068369
>
> Sent from the AppFuse - User mailing list archive at Nabble.com.
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: [EMAIL PROTECTED]
> For additional commands, e-mail: [EMAIL PROTECTED]
>
>
--
http://raibledesigns.com
---------------------------------------------------------------------
To unsubscribe, e-mail: [EMAIL PROTECTED]
For additional commands, e-mail: [EMAIL PROTECTED]
