Search code examples
jquerygoogle-chromemagentohtml-select

Chrome: Changing Select Value with jQuery is not working correctly


This code worked in IE, FF, and Safari (windows7).

It is not working in Chrome however.

Basically, I am trying to make some changes on page load (Magento product page). I change the selected option (of a hidden select dropdown), then when they hover over the Add to Cart button, I make sure that an option was selected.

Code below:

$j('select#attribute76').val( $j('a'+hash).attr('index') ).change();
alert($j('select#attribute76').val()); // shows correctly w/ all browsers

... then later on ...

 $j('#addtocartbutton').hover(function(){
      //alert($j('select#attribute76 option:selected').val());// empty in Chrome!
      if ($j('select#attribute76').val()=='')// empty in Chrome!
           $j('.infoOptionsColors a:first').click(); 
     });

What is happening is that Chrome is selecting the option that I am asking it to, but it reverts back somehow... perhaps there is another call that is overriding it..


Solution

  • I still do not know what the problem was.

    I resolved it by moving my code towards the end of the javascript calls more.

    The code that I moved it after seems barely related.. assigning the more to the .click function which is just adding/removing classes, and not changing any form values. + some vide code..

    Thanks @clockworkgeek for trying to help.