user2310422
user2310422

Reputation: 555

Multiple Jquery UI Progressbar

I have multiple Progressbars on my website such as below, each must contain different values depending on the value I put on the value attribute. The code is working, however, it only gets the first value which is 40 and apply this value to all progressbar. I have posted the javascript as well below please let me know what I am doing wrong.

<div value="40" class="progressbar"></div>
<div value="70" class="progressbar"></div>
<div value="90" class="progressbar"></div>


<script>
  $(function() {
    $( ".progressbar" ).progressbar({
      value: parseInt($(".progressbar").attr('value'))
    });
  });
  </script>

Upvotes: 1

Views: 882

Answers (1)

A. Wolff
A. Wolff

Reputation: 74420

Use an each() loop to keep reference on targeted element:

$(function() {
    $( ".progressbar" ).each(function(){
       $(this).progressbar({
          value: parseInt(this.value,10)
       });
    });
});

Upvotes: 1

Related Questions