rater icon indicating copy to clipboard operation
rater copied to clipboard

iOS support

Open synopticprod opened this issue 9 years ago • 16 comments

Hi, is this script supported on iOS browser ? I'm testing it on iPad (http://auxiliary.github.io/rater/) and if there are multiple rating elements on the same page, each click on one rating element resets the others to their default value.

is it normal ?

synopticprod avatar Jan 30 '16 21:01 synopticprod

Rater hasn't been tested on iOS, however, this is a very strange bug and I haven't seen it before. Did you test the rater homepage or did you use the script and made your own test?

auxiliary avatar Jan 31 '16 17:01 auxiliary

I tested both, rater homepage and my own test.

synopticprod avatar Jan 31 '16 17:01 synopticprod

So I tested on a couple of places and it worked on an iPad and an iPhone but it had problems on certain versions of Firefox on Mac OSX. The problem only occurred for some star symbols, meaning that the UTF8 code for those is probably represented in a different way. Did you also see this occur for the heart rating at the bottom of the page?

auxiliary avatar Feb 09 '16 17:02 auxiliary

Yes, this issue occurs also with the heart rating. My IPADs are in IOS 8, i will try to find IOS 9 devices to test it.

synopticprod avatar Feb 18 '16 22:02 synopticprod

Is there any fix for that issue? I have the same probleme on all mobile iOS devices.

G43beli avatar Mar 22 '16 12:03 G43beli

@auxiliary Same problem, iOS multiple raters breaks it

rsands2801 avatar Jun 19 '16 03:06 rsands2801

I have the same problem, the reason is that mobile iOS treats clicks as hover event. The solution is described here http://stackoverflow.com/questions/7892863/jquery-click-not-working-with-ipad . In rater.js file you need to replace $(this.element).on("click", $.proxy(this.select, this)); with $(this.element).on("click touchstart", $.proxy(this.select, this));

ghost avatar Sep 27 '16 12:09 ghost

rater.js on iOS can't emmit "change" event.

shiny avatar Feb 15 '17 09:02 shiny

Change "click" to "click touchstart" works but

$(".rating").on("change", function(ev, data){
  console.log(data.from, data.to);
});

shows

0 NaN
NaN 5

shiny avatar Feb 15 '17 10:02 shiny

Hello. I downloaded examples page. If i touch on one of rating then all other rating to be clean.
Tested on iphone 6.

sun-ks avatar Mar 15 '17 14:03 sun-ks

Yeah, I'm a little screwed. I'm building a mobile web app using rater.js. I had to add multiple raters on one page and I didn't realize until now that mobile safari is broken. Not much time to roll my own solution, but I can't find any workaround. :-( suggestions?

brandonrich avatar Mar 17 '17 05:03 brandonrich

I ended up using a different package called RateYo (http://rateyo.fundoocode.ninja/) - apple and Safari are pretty major browsers and really needs corrected. Sorry for recommending another package @auxiliary but just helping @brandonrich out with a package that works.

rsands2801 avatar Mar 18 '17 13:03 rsands2801

Is there a workaround for this issue? Thanks

kokujin avatar Jun 13 '17 15:06 kokujin

@rsands2801 same for me and also worked!

alejo8591 avatar Sep 12 '17 21:09 alejo8591

@ghost Thanks! It works perfect

rainsound-k avatar Aug 20 '18 09:08 rainsound-k

I had the same problem on the iPad. I fixed (hacked) the problem like this:

    $('.star-rating').rate({
        max_value: 5,
        step_size: 0.5,
        selected_symbol_type: 'fontawesome_star'
    }).on('touchend', function(ev) {
        var offset = $(this).offset();
        var rating = (ev.originalEvent.changedTouches[0].pageX - offset.left) / $(this).width() * 10;
        $(this).rate('setValue', Math.ceil(rating)/2);
    });

It's not a good solution, but it's working for me.

josefburger avatar Sep 13 '19 08:09 josefburger