CODEWITHSUNDEEP
javascriptjquery
RedGiant
RedGiant

Reputation: 4748

Replace parts of url with strings from data attributes in different elements

Please take a look at this FIDDLE. Is there any way to get data attributes from all div.query and replace part of an url with them? For example, I have this URL:

http://web.com?get=placeholder|placeholder|placeholder

How can I replace the placeholders with data attributes so that it becomes

http://web.com?get=Africa|Asia|Europe

The order isn't important. Any suggestions or alternatives (append the queries after one another after the main url)?

HTML:

<div id="main" data-source="http://web.com?get=placeholder|placeholder|placeholder"></div>

<div class="query" data-term="Africa"></div>
<div class="query" data-term="Asia"></div>
<div class="query" data-term="Europe"></div>

Script:

$( document ).ready(function() {
   $(".query").each(function() { 
     var div_terms  =  $(this).data('term'),
     source =  $('#main').data('source');
     $('.result').html(source.replace('placeholder',div_terms))
   });
});



<div class="result"></div>

Upvotes: 0

Views: 267

Answers (1)

halkujabra
halkujabra

Reputation: 2942

http://jsfiddle.net/cHtT6/1/

You just missed to updated the content in '#main'.

Upvotes: 3

Related Questions