Обратный вызов AJAX не видит метод плагина jQuery - PullRequest
0 голосов
/ 19 февраля 2019

Я получаю данные из ответа AJAX и пытаюсь обновить плагин jQuery с этим значением в обратном вызове успеха:

$.ajax({
   url: '/some/url',
   type: 'GET',
   dataType: 'json',
   success: (data) => {
      $(".my-rating").starRating('setRating', data.rating);
   }
});

Я использую плагин star-rating-svgпоказать ratigns (http://nashio.github.io/star-rating-svg/demo/). Проблема в том, что у меня ошибка:

Uncaught TypeError: $ (...). starRating не является функцией

Тем не менее, эта функция прекрасно работает, когда вызывается вне AJAX обратного вызова. Вы знаете, как с этим справиться?

РЕДАКТИРОВАТЬ:

Большой кусок моегокод:

show.ejs

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
    <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
    <script type="text/javascript" src="/star-svg/src/jquery.star-rating-svg.js"></script>
    <link rel="stylesheet" type="text/css" href="/star-svg/src/css/star-rating-svg.css">
   </head>    
   <body>
    <div class="my-rating mb-1"></div>

    <script>
    function getUserRating() {
            $.ajax({
                url: '/some/url/rating',
                type: 'GET',
                dataType: 'json',
                success: () => {
                    $(".my-rating").starRating('setRating', data.rating);
                }
            });
        }

    function webpageReady() {
            if($(".my-rating").is(':visible')) {

                $(".my-rating").starRating({
                    starSize: 20,
                    disableAfterRate: false,
                    callback: function(currentRating, $el){
                        $.ajax({
                            url: '/some/url/setRating',
                            type: 'POST',
                            data: {'rating' : currentRating}
                        });
                    }
                });
                getUserRating();
            }
        }
    </script>
    <script type="text/javascript">webpageReady();</script>
    </body>
</html>

rating.js

router.get("/some/url/rating", function (req, res) {
    Rating.findOne({'author.id': req.user._id}).populate("ratings").exec(function(err, rating){
        if(err){
            console.log(err);
        }
        else{
            res.send({userRating : rating});
        }
    });
});

Ответы [ 2 ]

0 голосов
/ 21 февраля 2019

Проблема решена: в нижнем колонтитуле была еще одна ссылка на jquery.

0 голосов
/ 19 февраля 2019

Вот простая демонстрация для этого плагина

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 <script src="https://cdn.jsdelivr.net/npm/star-rating-svg@3.5.0/src/jquery.star-rating-svg.js"></script> 

</head>
<body>

<div class="my-rating"></div> 
<script>
$(document).ready(function(){
   $(".my-rating").starRating({
    starSize: 25,
    callback: function(currentRating, $el){
        // make a server call here
    }
});
});
</script>

</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...