2

I have the following code which is used to show/hide different divisions dependent on the selection made by the user from a dropdown box - http://jsfiddle.net/6EDkR/

It works fine as a standalone piece of coding but as soon as it is dropped in to my CS-Cart environment it works for the first selection but then doesn't update if you change the choice.

There is obviously something clashing from within CS Cart but not sure where to start trying to work out what is going wrong, Chrome isn't highlighting any obvious clashes or issues.

Vince P
  • 1,781
  • 7
  • 29
  • 67
  • becaus you're having to change Event one in `onChange="fn_change_options..` and other in `$("select#option_29821_746").change(` may cause conflict – mgraph Mar 20 '12 at 14:36
  • the `onChange=` in the select is a CS Cart function which needs to be there, is there a way to make both work together? – Vince P Mar 20 '12 at 14:39

1 Answers1

2

It's simple... fn_change_options is re-writing the SELECT element, you should re-bind the change handler to change the images...

I didn't have time to analyse all your code, but if you change the .bind('change') for .live('change') it would work (but you should check in your code where you replace the select element..)

So, this code:

$("select#option_29821_746").change(function() {
  $("div.imgDiv").hide();
  var targetId =  $(this).val();
  $("#" + targetId).show();
});

Should became like this:

$("select#option_29821_746").live('change',function() {
  $("div.imgDiv").hide();
  var targetId =  $(this).val();
  $("#" + targetId).show();
});
Rafael Verger
  • 1,751
  • 13
  • 18
  • Simple when you know how! :) works perfectly thank you SO much, it's been bugging me over the weekend! – Vince P Mar 20 '12 at 15:03