rateit and jquery mobile - problem with data-role=none

Nov 5, 2013 at 7:34 AM
Edited Nov 5, 2013 at 9:41 AM
Hi!

Edit: I found the problem, just crazy but now its working. there was data-enhanchment="false" missing in the div. I leave the question if someone needs it:



I am really stuck here. I am using jquery mobile with the rateit plugin. Following scripts

jquery-1.7.1.min.js
jquery.mobile-1.3.2.min.js

Between them the mobileinit event like this
    <script type="text/javascript">
        $(document).bind("mobileinit", function(){
            $.extend( $.mobile , {
                ignoreContentEnabled : true
            });
        });
    </script>
And inside body the rateitplugin js
<script src="assets/jquery.rateit.min.js" type="text/javascript"></script>
I have setup several pages with JQM with a simple page navigation which leads to the different page ids

<div data-role="page" id="one">
<div data-role="page" id="two">

and the english versions

<div data-role="page" id="one-en">
<div data-role="page" id="two-en">

On page one I have the jquery rateit plugin active with the big stars:
<div class="rateit bigstars" id="rateitcontainer" data-rateit-step="1" data-rateit-starwidth="128" data-rateit-starheight="128" data-rateit-resetable="false" data-role="none"></div>
On the first page I have also the link to the english version:
<p><a href="#one-en"><img src="assets/images/gb.png" alt="gb" title="in english" /></a></p>
If I click this link, the JQM makes the rating div with the JQM style, despite the data-role="none" attribut.

I also asked this at the jquery forum: http://forum.jquery.com/topic/problem-with-rateit-plugin-and-jqm-data-role-none-is-ignored
Coordinator
Nov 7, 2013 at 1:30 PM
Thats good to hear.
Nov 12, 2013 at 6:39 PM
That's an easy one. To remove jquery formatting you add attribute data-role = "none", however in this case under the covers the rateit.js creates a button to handle events and so on. So just look in the source .js file for the text <button and add data-role="none" after it. Once you launch your app and refresh the browser the visible button above the star rating panel will disappear.

have fun!
Coordinator
Nov 13, 2013 at 9:33 AM
Thanks for the help. I've uploaded a new version (1.0.15)