Opera problem with jquery

[henribaeyens]

Hello,

I've come up with something weird while checking out a site with Opera 9
(latest version on XP). Tis an ecommerce site and in product pages what I
do is update some elements according to a given product's price and
options. So, when I pick an option, I change the display of the price to
show the option price and, if the product is out of stock, hide the buy
button and replace it with a message... See, for instance,
http://www.magellys.com/acatalog/Pantalons_hiver_hommes.html and go to
the second product, pick the size 40 and then the size 44... See what
this does? This works using jquery's html() function. And it works fine
on FF (linux and xp), on IE7, on Safari (windows version 3), but not in
Opera. In the latter, what happens is that, while the price div is
correctly overwritten, the add-to-cart-button div is overwritten AND
MOVED underneath the image (or, if you will, close to the top left corner
of the container div (which holds both the image and the product's info))
Here's the code that handles the add-to-cart-button div:

function enableadd(productref) {
html = '<table><tr>';
html += '<td style="padding-right: 0.75em;">Quantit&eacute;:</td>';
html += '<td style="padding-right: 0.75em;"><input name="Q_' + productref + '" size="3" value="1" type="text"></td>';
html += '<td><input src="add_to_cart.gif" name="_' + productref + '" alt="Add to Cart" type="image"></td>';
html += '</tr></table>';
eval("abElements['"+productref+"'].html(html)");
}

function disableadd(productref) {
html = '<span style="font-size: 12pt; font-weight: bold; color: red;">Produit &eacute;puis&eacute;!</span>';
eval("abElements['"+productref+"'].html(html)");
}

The element containing the add-to-cart-button follows:

<div class="product_add" id="addbutton_<productcode>">
<table><tr>
<td style="padding-right: 0.75em;">Quantité:</td>
<td style="padding-right: 0.75em;"><input type="text" name="Q_<productcode>" size="3" value="1" /></td>
<td><input type="image" src="add_to_cart.gif" name="_<productcode>" alt="Add to Cart"/></td>
</tr></table>
</div>

<script type="text/javascript">
abElements["<productcode>"] = jQuery('div#addbutton_<productcode>');
</script>

Only the table is overwritten.

Has anyone come across a similar problem?

 

[Gregor Kofler]

henribaeyens meinte:

[problem with jQuery]

Has anyone come across a similar problem?

Most likely not in this NG, since jQuery is considered being crap by
nearly all regulars here. But I suppose there are jQuery forums on the
web - google will help.

Gregor

 

[henribaeyens]

henribaeyens meinte:

[problem with jQuery]

Has anyone come across a similar problem?

Most likely not in this NG, since jQuery is considered being crap by
nearly all regulars here. But I suppose there are jQuery forums on the
web - google will help.

Gregor

I didn't know jquery was considered as crap around here. But it's still
javascript, ain't it? It just makes some things (like accessing dom
elements) easier and more straightforward.

 

[Gregor Kofler]

henribaeyens meinte:

I didn't know jquery was considered as crap around here.

This assumption comes up frequently, and was discussed here recently[1].

But it's still
javascript, ain't it?

Badly written JS. By (and that's IMO the troubling aspect) a
self-proclaimed "JS evengelist".
Anyway, this NG deals with JS problems, not with problems caused by
"products" written in JS. One would not ask in a C++ group when having a
problem with MS Word since part of it is written in C++...

It just makes some things (like accessing dom
elements) easier and more straightforward.

What's complicated with accessing DOM elements? The extra characters
when typing "document.getElementById" instead of "$"?

Gregor


[1]
<http://groups.google.at/group/comp.lang.javascript/browse_frm/thread/2072e63631688fc4/>

 

[henribaeyens]

henribaeyens meinte:

I didn't know jquery was considered as crap around here.

This assumption comes up frequently, and was discussed here recently[1].

But it's still
javascript, ain't it?

Badly written JS. By (and that's IMO the troubling aspect) a
self-proclaimed "JS evengelist".
Anyway, this NG deals with JS problems, not with problems caused by
"products" written in JS. One would not ask in a C++ group when having a
problem with MS Word since part of it is written in C++...

It just makes some things (like accessing dom elements) easier and more
straightforward.

What's complicated with accessing DOM elements? The extra characters
when typing "document.getElementById" instead of "$"?

Gregor


[1]
<http://groups.google.at/group/comp.lang.javascript/browse_frm/

thread/2072e63631688fc4/>

Points granted.

Anyways, it turns it wasn't javascript (and jquery) at all but a stray
closing div tag. Mea culpa.

 

[Henry]

henribaeyens meinte:

[problem with jQuery]

Has anyone come across a similar problem?

Most likely not in this NG, since jQuery is considered being
crap by nearly all regulars here. But I suppose there are
jQuery forums on the web - google will help.

I didn't know jquery was considered as crap around here. But
it's still javascript, ain't it?

Maybe, but you asked your question in the absence most of the code
which it is dependent upon and so either assumed a familiarity with
the use of (and internal details of) JQuery which you will not tend to
find here, or you did not want the question answered.

It just makes some things (like accessing dom
elements) easier and more straightforward.

Easier and more straightforward than what exactly? The code you posted
included a couple of instance of things like:-

eval("abElements['"+productref+"'].html(html)");

- which are the non-straightforward, less efficient, hard to debug
and, at minimum, harder to write alternative to:-

abElements[productref].html(html);

If you start off making things difficult for yourself you will
perceive more things as "easier and more straightforward" than people
who learn javascript first and then start making comparisons between
applications of it.