Magento setAttribute error on checkout page

Question

Ok so when you "Proceed to Checkout", it gives you a list of :

1. CHECKOUT METHOD
2. BILLING INFORMATION
3. SHIPPING INFORMATION
4. SHIPPING METHOD
5. PAYMENT INFORMATION
6. ORDER REVIEW

By default, checkout method is suppose to be dropped down and when you hit "Continue", billing information will drop down similar to this : http://www.plazathemes.com/demo/ma_musicgear/index.php/checkout/onepage/

However, when I go to that page, checkout method isn't dropped down and whenever I click on it, nothing happens. Now these are all my JS errors:

Uncaught TypeError: Object [object Object] has no method 'attachEvent' prototype.js:5644
2
Uncaught TypeError: Object [object Object] has no method 'attachEvent' prototype.js:5653
Uncaught TypeError: Object [object Object] has no method 'setAttribute' clearchannel.halfoffdeals.com/index.php/checkout/onepage/:349
Uncaught TypeError: Object [object Object] has no method 'attachEvent' prototype.js:5644
Uncaught TypeError: Object [object Object] has no method 'observe' opcheckout.js:236
Uncaught TypeError: Object [object Object] has no method 'setAttribute' clearchannel.halfoffdeals.com/index.php/checkout/onepage/:544
Uncaught TypeError: Object [object Object] has no method 'observe' opcheckout.js:374
Uncaught TypeError: Object [object Object] has no method 'observe' opcheckout.js:537
Uncaught TypeError: Object [object Object] has no method 'getElementsByTagName' prototype.js:5010
Uncaught TypeError: Object [object Object] has no method 'attachEvent' prototype.js:5653
Uncaught TypeError: Object [object Object] has no method 'attachEvent' prototype.js:828
Uncaught TypeError: Object [object Object] has no method 'dispatchEvent'

Do any of those have anything to do with this? I'm getting all the attachEvent and blah blah from prototype because of bootstrap. I don't know how to resolve that so I'm currently putting that on hold. I'm guessing the setAttribute is definitely something that could be causing the problem?

Thanks for any help..

I don't know if this would be of any help, but on the shopping cart page before you hit Proceed to Checkout, it lists this label "State/Province" under ESTIMATE SHIPPING AND TAX, but not the select/input box.. So it's coming up as an invalid region_id on checkout page:

So the SetAttribute error is coming from this section:

                        <div class="field">
                            <label for="shipping:region" class="required"><em>*</em>State/Province</label>
                            <div class="input-box">
                                <select id="shipping:region_id" name="shipping[region_id]" title="State/Province" class="validate-select" style="display:none;">
                                    <option value="">Please select region, state or province</option>
                                </select>
                                <script type="text/javascript">
                                //<![CDATA[
                                    $('shipping:region_id').setAttribute('defaultValue',  "");
Uncaught TypeError: Object [object Object] has no method 'setAttribute'
                                //]]>
                                </script>
                                <input type="text" id="shipping:region" name="shipping[region]" value="" title="State/Province" class="input-text " style="display:none;" />
                            </div>
                        </div>

It's saying $('shipping:region_id') has no method setAttribute..

Answer 1

@ROMMEL has helped with the answer. These are the steps I took to solve the issue:

• Put this in a jquery-noconflict.js file : jQuery.noConflict();
• Add it in right after your jQuery.js file in the

DONE! =) Makes a lot of errors that people said bootstrap and prototype interfering with each other. All those errors disappear after issuing the noConflict()!

Answer 2

Always add jQuery.noConflict(); JS file jQuery.noConflict(); JS file before prototype.js on page.xml file. means like this

<action method="addJs"><script>global.js</script></action> <action method="addJs"><script>jquery.jcarousel.pack.js</script></action> <action method="addJs"><script>jquery.noconflict.js</script></action> <action method="addJs"><script>prototype/prototype.js</script></action>

Answer 3

将prototype.js文件替换为新的magento备份并再次检查。