CODEWITHSUNDEEP
javascriptjqueryjspjquery-plugins
user3681970
user3681970

Reputation: 1281

rating is not a function jquery plugin error

I have a jsp page. In that i am trying jquery star rating. I am using this plugin http://www.fyneworks.com/jquery/star-rating/. But JS error is coming like TypeError: $(...).rating is not a function Here is my JSP code.

<div class="book-right" id="ajaxTest">
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/jquery.rating.js"></script>
    <script type="text/javascript" src="js/jquery-latest.js"></script>
    <script type="text/javascript" src="js/jquery.tablesorter.js"></script>
    <script type="text/javascript" src="js/jquery.tablesorter.min.js"></script>
    <--table + some intermediate loop code --->
        <c:forEach var="leg" items="${option.legs}" varStatus="loopCounter3">
            <div>
                <input type="radio" name="rating-${loopCounter2.index}" value="1" class="rating-star" />
                <input type="radio" name="rating-${loopCounter2.index}" value="2" class="rating-star" />
                <input type="radio" name="rating-${loopCounter2.index}" value="3" class="rating-star" />
                <input type="radio" name="rating-${loopCounter2.index}" value="4" class="rating-star" />
                <input type="radio" name="rating-${loopCounter2.index}" value="5" class="rating-star" />
            </div>
            <input type="hidden" id="avgRating" name="avgRating" value="${leg.courierProduct.rating}"></input>

            <script>
                var avgRating = $('#avgRating').val();
                $('.rating-star').rating('select', avgRating);
            </script>
        </c:forEach>
</div>

I have removed some JSP code to make it simple.

Upvotes: 0

Views: 5899

Answers (1)

dfsq
dfsq

Reputation: 193301

You don't need to load jQuery twice. What happens in this case, is the second time it overwrites previous one with rating prototype method.

This should work for you:

<script src="js/jquery-latest.js"></script>
<script src="js/jquery.rating.js"></script>

Another problem is that you are not initializing plugin properly. It should be:

$('.rating-star').rating().rating('select', avgRating);

... initialize first, then call select method.

Demo: http://plnkr.co/edit/OIjbvkff27YdX4snKnB2?p=preview

Upvotes: 5

Related Questions