Jump to content
GTAV6

I need some JavaScript help urgently...

Recommended Posts

Help, help! :o(

 

I've just finished a website for someone, in which a particular piece of js works perfectly on my site, but upon uploading the files to their new hosting, it only partially works.

 

Here's the offending article:

$(document).ready(function(){
  /* Select form */
  $("#package, #quote, #send").css("display","none");
  $(".select").click(function(){
	if ($('input[name=selectform]:checked').val() == "Request a price") {
		$("#package").slideUp("fast");
		$("#quote").slideDown("fast");
		$("#send").slideDown("fast");
		$.cookie('formSelection', 'expanded');
	}
	if ($('input[name=selectform]:checked').val() == "Make a booking") {
		$("#package").slideDown("fast");
		$("#quote").slideUp("fast");
		$("#send").slideDown("fast");
		$.cookie('formSelection', 'expanded');
	}
  });
	var showTop = $.cookie('formSelection');
	if (showTop == 'expanded') {
	$("#package, #quote, #send").show("fast");
	$('input[name=selectform]:checked');
  } else {
	$("#package, #quote, #send").hide("fast");
	$('imput[name=selectform]:checked');
  }
  /* Select optional extras */
  $("#exterior, #interior, #fullmonty").css("display","none");
  $(".valetpackage").click(function(){
	if ($('input[name=selectpackage]:checked').val() == "Exterior Turbo Groom") {
		$("#exterior").slideDown("fast");
		$("#interior").slideUp("fast");
		$("#fullmonty").slideUp("fast");
		$.cookie('valetSelection', 'expanded');
	}
	if ($('input[name=selectpackage]:checked').val() == "Interior Turbo Groom") {
		$("#interior").slideDown("fast");
		$("#exterior").slideUp("fast");
		$("#fullmonty").slideUp("fast");
		$.cookie('valetSelection', 'expanded');
	}
	if ($('input[name=selectpackage]:checked').val() == "Super Inside and Out Groom") {
		$("#interior").slideUp("fast");
		$("#exterior").slideUp("fast");
		$("#fullmonty").slideUp("fast");
		$.cookie('valetSelection', 'collapsed');
	}
	if ($('input[name=selectpackage]:checked').val() == "The Full Monty Groom") {
		$("#interior").slideUp("fast");
		$("#exterior").slideUp("fast");
		$("#fullmonty").slideDown("fast");
		$.cookie('valetSelection', 'expanded');
	}
  });
	var showTop = $.cookie('valetSelection');
	if (showTop == 'expanded') {
	$("#exterior, #interior, #fullmonty").show("fast");
	$('input[name=selectpackage]:checked');
  } else {
	$("#exterior, #interior, #fullmonty").hide("fast");
	$('imput[name=selectpackage]:checked');
  }
});
On the new site, the first part (select form) works but not the second (select optional extras). On my own site, both portions behave as they're intended. I'm stuck and I've a slightly miffed client breathing down my neck...

 

I've tried running it as two separate piece of js - once again, no problem on my site, but on the new site it only actions whichever piece is listed first and ignores the second. I vaguely recollect running into something like this years ago, but can't remember what was done to overcome it. Any ideas?

Share this post


Link to post
Share on other sites

Select form goes from line 2 - 25

Optional extras from 27 - 52

No, in the optional section does any of the code get executed?

 

ie.

$("#exterior, #interior, #fullmonty").css("display","none");

or does it enter the if statements? etc...

 

is it going into:

$(".valetpackage").click(function(){

randomly put in alert statements to see what line of code it is stopping at, or better yet, have you run a debugger to see if any errors are thrown in your browser?

Share this post


Link to post
Share on other sites

Sorry, the 'optional extras' refers to the form on the web page, not the js. So, yes, that is supposed to be executed.

 

Selecting "Request a price" or "Make a booking" will present the applicable lower half of the form. If a booking is selected, choosing a valet package will present the applicable optional extras.

 

I FireBugged it, but it didn't throw up any flags. JavaScript isn't my forte, I'm afraid.

 

What's throwing me, is that this:

$(document).ready(function(){
  /* Select form */
  $("#package, #quote, #send").css("display","none");
  $(".select").click(function(){
	if ($('input[name=selectform]:checked').val() == "Request a price") {
		$("#package").slideUp("fast");
		$("#quote").slideDown("fast");
		$("#send").slideDown("fast");
		$.cookie('formSelection', 'expanded');
	}
	if ($('input[name=selectform]:checked').val() == "Make a booking") {
		$("#package").slideDown("fast");
		$("#quote").slideUp("fast");
		$("#send").slideDown("fast");
		$.cookie('formSelection', 'expanded');
	}
  });
	var showTop = $.cookie('formSelection');
	if (showTop == 'expanded') {
	$("#package, #quote, #send").show("fast");
	$('input[name=selectform]:checked');
  } else {
	$("#package, #quote, #send").hide("fast");
	$('imput[name=selectform]:checked');
  }
});
and this:

$(document).ready(function(){
  /* Select optional extras */
  $("#exterior, #interior, #fullmonty").css("display","none");
  $(".valetpackage").click(function(){
	if ($('input[name=selectpackage]:checked').val() == "Exterior Turbo Groom") {
		$("#exterior").slideDown("fast");
		$("#interior").slideUp("fast");
		$("#fullmonty").slideUp("fast");
		$.cookie('valetSelection', 'expanded');
	}
	if ($('input[name=selectpackage]:checked').val() == "Interior Turbo Groom") {
		$("#interior").slideDown("fast");
		$("#exterior").slideUp("fast");
		$("#fullmonty").slideUp("fast");
		$.cookie('valetSelection', 'expanded');
	}
	if ($('input[name=selectpackage]:checked').val() == "Super Inside and Out Groom") {
		$("#interior").slideUp("fast");
		$("#exterior").slideUp("fast");
		$("#fullmonty").slideUp("fast");
		$.cookie('valetSelection', 'collapsed');
	}
	if ($('input[name=selectpackage]:checked').val() == "The Full Monty Groom") {
		$("#interior").slideUp("fast");
		$("#exterior").slideUp("fast");
		$("#fullmonty").slideDown("fast");
		$.cookie('valetSelection', 'expanded');
	}
  });
	var showTop = $.cookie('valetSelection');
	if (showTop == 'expanded') {
	$("#exterior, #interior, #fullmonty").show("fast");
	$('input[name=selectpackage]:checked');
  } else {
	$("#exterior, #interior, #fullmonty").hide("fast");
	$('imput[name=selectpackage]:checked');
  }
});
... will also work on my site, but on the new, it'll only execute whichever is listed first - ie;

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

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

will execute selectForm.js and ignore optionalExtras.js - and vice-versa.

 

 

edit - removed defunct link now that the problem's solved.

Edited by GTAV6

Share this post


Link to post
Share on other sites

Well, I'm still stumped. I've rebuilt that script half a dozen different ways and each works on my web hosting but not the clients :o(

 

If anybody can come up with even so much as a pointer that sets me in the right direction, I'd be extremely grateful...

Share this post


Link to post
Share on other sites

Errors in the browser console (Ctrl+Shift+J on Chrome)?

Are there errors in all browsers?

If you view source and copy the source into a diff tool (winmerge for example) is the source the same?

Are all JS files loading or any JS errors being raised.

I assume the actual site is hosted from the web servers root? is there a problem with paths?

 

The version of jQuery you are using is very very old (although that "shouldn't" break things).

Edited by SledgY

Share this post


Link to post
Share on other sites

Bingo - thanks a heap, SledgY!!!

 

According to Chrome (I didn't know it did that, much to my embarrassment), the web host's server was throwing a 406 error in the background: its mod_security settings refuse to retrieve a jquery snippet because it was named jquery.cookie.js! A simple renaming of the file bypassed that and everything now functions correctly :o)

Share this post


Link to post
Share on other sites

Bah-humbug! :o(

 

That only fixed the issue in Chrome... IE, Firefox and Opera still won't do it. Back to square one.

Share this post


Link to post
Share on other sites

Firefox has a similar tool Ctrl+Shift+Q in Firefox for the network tab. IE I think it's F12. Not sure about Opera.

Share this post


Link to post
Share on other sites

Aha! I had an incorrect string (from my earlier messing around), that for some reason Chrome was interpreting correctly, but FF & IE weren't. Of all things, it was IE that pointed out the error!

 

Everything works now - thanks again, SledgY, I owe you one :o)

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×