Why won't my jquery slide?

randombar

Link

Click on the dates: http://www.ratemypub.ie/template/index.php

<a href="javascript:;" onmousedown="showDate('0','2008-1-1')" id="slick-toggle"><b > 1 </b></a>

The slide should work on the dates, if you click a date a div should slide down with the gigs on that date!

Jquey Code

//JQuery Code

$(document).ready(function() {

	// hides the slickbox as soon as the DOM is ready
	
	$('#txtDate').hide();
	
	// toggles the slickbox on clicking the noted link 
	
	$('a#slick-toggle').click(function() {
		$('#txtDate').toggle(400);
		return false;
	});
});


// --

Have an empty div id="txtDate"

Ph3n0m

this still an issue?

randombar

Yup, any help much appreciated!

Ph3n0m

ok well first of all in Firefox, any text in the calendar looks "off" - completely different to the linked numbers.

Ok - to business, the calendar does what its supposed to - show details based on that date - but it only "appears" it doesnt slide, correct?

randombar

Ph3n0m wrote: »

ok well first of all in Firefox, any text in the calendar looks "off" - completely different to the linked numbers.

Ok - to business, the calendar does what its supposed to - show details based on that date - but it only "appears" it doesnt slide, correct?

How do you mean off? Weird!!!

and ya it shows the details but there's no slide??

Even with id="slick-toggle"??

Ph3n0m

see attached for weird

also where in your source is the js that loads in jQuery?

randombar

Ah ya I've to fix that up all right, it's looks even weirder now in IE

Anyway can anyone help me with the lack of slide?

Ph3n0m

GaryCocs wrote: »

Ah ya I've to fix that up all right, it's looks even weirder now in IE

Anyway can anyone help me with the lack of slide?

yes but first, where in the source html is the js that loads in the jQuery? cause I cannot seem to find it

randombar

Ph3n0m wrote: »

yes but first, where in the source html is the js that loads in the jQuery? cause I cannot seem to find it

The very bottom of this file is the js

http://www.ratemypub.ie/template/banner.js

Ph3n0m

nope I mean where is this file

goto http://jquery.com/ -> find the text that says "Download jQuery 1.2.2" - where is that js file, otherwise it wont work

randombar

Oh ya sorry:

<script src="jquery.js" type="text/javascript"></script>

http://www.ratemypub.ie/template/jquery.js

that jquery file is the one I downloaded!

Ph3n0m

The immediate that springs to mind is this
http://docs.jquery.com/Effects/slideToggle#speedcallback

$('a#slick-toggle').click(function() {
$('#txtDate').slideToggle(400);
return false;
});


remove the return false;

randombar

Ph3n0m wrote: »

The immediate that springs to mind is this
http://docs.jquery.com/Effects/slideToggle#speedcallback

$('a#slick-toggle').click(function() {
$('#txtDate').slideToggle(400);
return false;
});


remove the return false;

No Joy! Tried putting a <p> in the div and giving that the id txtDate but nothing??

Ph3n0m

I am actually now thinking that it could be because all clickable numbers have the same id of "slick-toggle"

similiar problems reported here

http://groups.google.com/group/jquery-en/browse_thread/thread/41d843e4a2fe6a79 - possible solution towards end of that page

randombar

Ya I changed it to class there, very bad coding of me to have two things with the same id, still no joy though. Very strange!

Ph3n0m

The problem is that each link in the calendar needs it own unique id - they cannot be all called "slick-toggle"

Re-read that article I linked too

ianhobo

and whats your showDate function like?

I don't see where/how the dates are uniquely identifiably?

But I've never used jQuery before, so ...

randombar

Ya I read that article and basically from what I can see they are kinda using classes instead of id's

EG a.comment instead of a#comment

so do I need to give the date links unique id's?

The difference between my one and theirs is that my div txtDate is the same div no matter what link is clicked?

Is it a problem running two different functions from the same link?

My showdate function is ajax:

// Ajax Show Date  //

var xmlHttpshowDate;

function showDate(countyid,date)
{ 
xmlHttpshowDate=GetXmlHttpObject()
if (xmlHttpshowDate==null)
 {
 alert ("Browser does not support HTTP Request")
 return
 }
var showDateUrl="ajax.php?showdate=1"
showDateUrl=showDateUrl+"&countyid="+countyid
showDateUrl=showDateUrl+"&date="+date
showDateUrl=showDateUrl+"&sid="+Math.random()
xmlHttpshowDate.onreadystatechange=stateChangedshowDate
xmlHttpshowDate.open("GET",showDateUrl,true)
xmlHttpshowDate.send(null)
}

function stateChangedshowDate() 
{ 
if (xmlHttpshowDate.readyState==4 || xmlHttpshowDate.readyState=="complete")
 { 
 document.getElementById("txtDate").innerHTML=xmlHttpshowDate.responseText;
 } 
}

// -------------------------------------------------------------------------------------------------  //

Ph3n0m

hmmmm unfortunately I am working blind here, since I cannot just save your page and edit it to my hearts content

try removing the showdate function from the link, and populate txtDate with some default text and see if the slide works that way.

randombar

Ph3n0m wrote: »

hmmmm unfortunately I am working blind here, since I cannot just save your page and edit it to my hearts content

try removing the showdate function from the link, and populate txtDate with some default text and see if the slide works that way.

Ya I know what you mean about working blind, i took that away too and it made no difference!

jquery if I get it working is class but it's bloody annoying!

randombar

Any solutions from anyone?

Can't see why it's not working?

ianhobo

Hi Gary,
Sorry, I've never used jQuery before, so I don't htink I've much to offer.

What do you want to happen on the calender when a date is clicked?

randombar

Hi Ian,

Again thanks for the patience, basically what I want to happen when the date is clicked is that the ajax fills in the events for that date (working nicely) and this then appears in a nice smooth slide down div?

Thanks
Gary

ianhobo

oki doki, ill have another look