Script works in firefox and safari, does not in ie

[Kai Kuehne]

Hi list!
I wrote a little script for a star-rating-thing which looks like:

function rate_dvd(id, score)
{
new Ajax.Request('/dvd/' + id + '/rate/' + score, {
method:'get',
requestHeaders: {Accept: 'application/json'},
onSuccess: function(transport){
var json = transport.responseText.evalJSON(true);
var new_score = json.new_score;
var new_width = new_score * 25;
var ul = document.getElementById(id);
var current_rating = ul.getElementsByClassName('current-rating')[0];

current_rating.setStyle({
width: new_width + 'px'
});
}
});
}

The html looks something like:

<ul class="star-rating" id="2">
<li class="current-rating" style="width: 0.0px;">&nbsp;</li>
....
</ul>
<ul class="star-rating" id="3">
<li class="current-rating" style="width: 0.0px;">&nbsp;</li>
....
</ul>

As you can see above, I just want to replace the width of the li element.
But this script doesn't work in IE (which is not that bad, but.. maybe
it's a little thing I've overseen because I never wrote JS before.)

So, maybe someone of you see what I've done wrong?

Thank you
Kai

[Tom Gregory]

Id's are supposed to begin with a letter.
http://www.w3.org/TR/html4/types.html#type-name
http://www.w3.org/TR/html4/struct/global.html#h-7.5.2

Also, in IE you need to make sure you don't have name attributes that
conflict with ids. IE will return elements incorrectly through
document.getElementById (use $(), btw), if the name attribute value
matches the id you're searching for.

TAG

[Kai Kuehne]

Hi Tom,

On 8/1/07, Tom Gregory <to...@byu.net> wrote:
>
> Id's are supposed to begin with a letter.
> http://www.w3.org/TR/html4/types.html#type-name
> http://www.w3.org/TR/html4/struct/global.html#h-7.5.2

Tried it with a letter too, but it didn't work with $(). See below.

> Also, in IE you need to make sure you don't have name attributes that
> conflict with ids. IE will return elements incorrectly through
> document.getElementById (use $(), btw), if the name attribute value
> matches the id you're searching for.

$() gives me (e.g.) '5' but not the element which I need.
document.getElementById does what I expect.

I change the id to begin with a character, thanks Tom.

Kai

[Kai Kuehne]

Hi again,
I chaned the id as described from:

<.. id="1"> to <.. id="dvd-1" but it still doesn't work on internet explorer.
$() still gives me (in this case) 'dvd-1' but not the element itself.

Thanks for hints
Kai

[Diodeus]

I may be wrong here but....

var current_rating = ul.getElementsByClassName('current-rating')[0];

I'm not sure what the [0] is for at the end here. Do you want the
first element? I tried this and it doesn't return a value.

current_rating will be an array. You can't apply a style to an array:

current_rating.setStyle({
width: new_width + 'px'
});

You need to do this:

for(x=0;x<current_rating.length;x++) {
$(current_rating[x]).setStyle({width: new_width + 'px' });

[Kai Kuehne]

Hi,

On 8/1/07, Diodeus <dio...@gmail.com> wrote:
>
> I may be wrong here but....
>
> var current_rating = ul.getElementsByClassName('current-rating')[0];
>
> I'm not sure what the [0] is for at the end here. Do you want the
> first element? I tried this and it doesn't return a value.

current_rating always exists exactly one time, so this is correct.

Kai

[Diodeus]

Why not just grab it by ID instead of classname then?

var current_rating = $("dvd-1")

On Aug 1, 1:51 pm, "Kai Kuehne" <kai.kue...@gmail.com> wrote:
> Hi,