user3779776
user3779776

Reputation:

Jquery find multiple links href with same class and change name for each link depending on get page

I have this design:

HTML Welcome Page

<div id="links">
<a class="view" href="www.this.com/43534534534"><span class="link_number"></span>This one for all</a>
<a class="view" href="www.this.com/99540594544"><span class="link_number"></span>This not but why not</a>

....100 of those here.....

</div>

JQUERY

$('#links').find('a.view').each(function(){
  quickC = $(this).attr('href');
  $.get(quickC, function(html){
  var quantity = $(html).find('a.my_text').size();
  $('.link_number').append(quantity);
   });
});

HTML Page #1 www.this.com/43534534534

<a class="my_text">this this</a>
<a class="my_text">this this this this</a>
<a class="my_text">this this this</a>

HTML Page #2 www.this.com/99540594544

<a class="my_text">this this</a>
<a class="my_text">this this this this</a>

...

RESULT FROM JQUERY
Page #1 = found 3 links
Page #2 = found 2 links

...

DESIRED RESULT

HTML Welcome Page

<div id="links">
<a class="view" href="www.this.com/43534534534"><span class="link_number">**3**</span>This one for all</a>
<a class="view" href="www.this.com/99540594544"><span class="link_number">**2**</span>This not but why not</a>

....100 of those here.....

THE PROBLEM/QUESTION:

Everything works except I don't know why it pulls only first link and spread the same number to other link_number classes.

Question, how to make this code work as I may have 100 of those links with specific href and return processed link number to the related a.view link on welcome page?

Your input appreciated! Thank you.

Upvotes: 2

Views: 1978

Answers (2)

gaetanoM
gaetanoM

Reputation: 42054

After a lot of checks I propose the following solution:

    $(function() {
        $('#links').find('a.view').each(function(index) {
            var quickC = $(this).attr('href');
            $.get(quickC, function(data) {
                var quantity = $('<output>').append($.parseHTML(data)).find('a.my_text').size();
                $('span.link_number').eq(index).append(quantity);
            });
        });
    });

Hope that works!

Upvotes: 0

Fenistil
Fenistil

Reputation: 3801

The $('.link_number').append(quantity); will find all the spans, not just the one inside the active link you're downloading. So you have to pass the actual link object to the function that set the number of links, so it can find only that one span:

$.get(quickC,{},{linkobj: $(this)}).success(function(html) {
    var quantity = $(html).find('a.my_text').size();
    $('.link_number', this.success.linkobj).append(quantity);
});

Greetings

Upvotes: 1

Related Questions