JQuery создать несколько экземпляров рейтинга - PullRequest
0 голосов
/ 15 ноября 2018

Я пытаюсь создать несколько экземпляров виджета рейтинга из ajax, используя jquery / php.Проблема, с которой я сталкиваюсь, заключается в том, что я не могу создать несколько экземпляров кода.Я хочу добавить атрибуты в тег p, только если данные поступают из функции успеха вызова ajax.Для второго экземпляра я получу данные и отправлю их для отправки запроса.Но в настоящее время данные добавляются ко всем экземплярам.Я создаю уникальные виджеты на основе data-service-url-name.

Вот мой код:

jquery / Ajax

    $.ajax({
      url: './post.php',
      success: function(result){
        console.log(result)
        for(var i =0; i < result.length; i++){
         var pTag = '.rating-container p';
         var checkRating = $('.rating-container p').attr('data-service-url-name')
         var total_ratings = result[i]['total_ratings'];
         var average_ratings = result[i]['average_ratings'];
         var rating_id = result[i]['rating_id']
        if(checkRating == result[i]['service_url']){ 
           $(pTag).attr('data-service-rank', average_ratings);
           $(pTag).attr('data-rating-id', rating_id);
           $(pTag).attr('data-reviews-count', total_ratings);

    $('.star-bar-container').each(function(){
      initServiceResponsiveStarBar($(this),
       $(this).data('service-url-name'),
       $(this).data('reviews-count'));
   });
          }
        } 

      },
      dataType: 'json'
    })

Вот мой HTML.

<div class="rating-container">
        <p
        data-service-url-name="design-crowd"
        data-reviews-count="0"
        class="star-bar-container design-crowd unselected" 
        style="display: inline-flex;">
        <span data-star-rank="1" title="Poor" class="star-icon ratable full">☆</span>
        <span data-star-rank="2" title="Fair" class="star-icon ratable full">☆
        </span><span data-star-rank="3" title="Good" class="star-icon ratable full">☆
        </span><span data-star-rank="4" title="Very Good" class="star-icon ratable full">☆
        </span><span data-star-rank="5" title="Excellent" class="star-icon ratable half">☆</span>
      </p>
      <div class="hint-container"><label class="hint-label freelancer">Rate it!</label></div>
    </div>


    <div class="rating-container">
      <p
      data-service-url-name="upwork"
      data-reviews-count="0"
      class="star-bar-container upwork unselected" 
      style="display: inline-flex;">
      <span data-star-rank="1" title="Poor" class="star-icon ratable full">☆</span>
      <span data-star-rank="2" title="Fair" class="star-icon ratable full">☆
      </span><span data-star-rank="3" title="Good" class="star-icon ratable full">☆
      </span><span data-star-rank="4" title="Very Good" class="star-icon ratable full">☆
      </span><span data-star-rank="5" title="Excellent" class="star-icon ratable half">☆</span>
    </p>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...