Martin__R Martin__R - 1 month ago 10
Javascript Question

Get numbers out of a .xml website in Javascript

I am trying to get the exchange rates for certain currencies from this website and use these numbers for my currency coverter because they're updated daily.
Here's the calculator jsfiddle net/ems3bh7t/.

I have the currencies in selector options and their values are "EUR, USD, etc" just like they are in the exchange rate website linked above.



<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name=currencyOutput id=currencyOutput>
<option id=currency1 label="EUR (Euro)" value="EUR">EUR</option>
<option id=currency2 label="USD (US-Dollar)" value="USD">USD</option>
<option id=currency3 label="GBP (British Pound)" value="GBP">GBP</option>
<option id=currency4 label="YEN (Japanischer Yen)" value="YEN">YEN</option>
</select>





I think the best way to do this would be by somehow looking for the selected option's value in the website and then putting the numbers coming after that into a variable that can be used for calculating.



<Cube currency="USD" rate="1.0927"/>"
<Cube currency="JPY" rate="114.39"/>
<Cube currency="BGN" rate="1.9558"/>
<Cube currency="CZK" rate="27.022"/>
<Cube currency="DKK" rate="7.4376"/>





I'd appreciate any help or links to tutorials. I've done like 30 minutes of intense google and stack searches and haven't found anything that is explained or is even the same topic as mine.

Thanks for reading, if you need any more information or the full html/js program I can add it immediately.

Answer

Use AJAX or server to fetch data and then simply treat is as document markup:

//Same origin problem
$.ajax({
  url: 'http://www.ecb.europa.eu/stats/eurofxref/eurofxref-daily.xml',
  complete: function(res) {
    console.log("Response from AJAX attempt:", res.statusText);
  },
  dataType: 'text'
});

//Fiction response
var res = "<gesmes:Envelope xmlns:gesmes=\"http://www.gesmes.org/xml/2002-08-01\" xmlns=\"http://www.ecb.int/vocabulary/2002-08-01/eurofxref\">\n<gesmes:subject>Reference rates</gesmes:subject>\n<gesmes:Sender>\n<gesmes:name>European Central Bank</gesmes:name>\n</gesmes:Sender>\n<Cube>\n<Cube time='2016-10-27'>\n<Cube currency='USD' rate='1.0927'/>\n<Cube currency='JPY' rate='114.39'/>\n<Cube currency='BGN' rate='1.9558'/>\n<Cube currency='CZK' rate='27.022'/>\n<Cube currency='DKK' rate='7.4376'/>\n<Cube currency='GBP' rate='0.89158'/>\n<Cube currency='HUF' rate='309.23'/>\n<Cube currency='PLN' rate='4.3292'/>\n<Cube currency='RON' rate='4.5038'/>\n<Cube currency='SEK' rate='9.8150'/>\n<Cube currency='CHF' rate='1.0838'/>\n<Cube currency='NOK' rate='8.9858'/>\n<Cube currency='HRK' rate='7.5010'/>\n<Cube currency='RUB' rate='68.6064'/>\n<Cube currency='TRY' rate='3.3845'/>\n<Cube currency='AUD' rate='1.4339'/>\n<Cube currency='BRL' rate='3.4261'/>\n<Cube currency='CAD' rate='1.4605'/>\n<Cube currency='CNY' rate='7.4082'/>\n<Cube currency='HKD' rate='8.4741'/>\n<Cube currency='IDR' rate='14240.57'/>\n<Cube currency='ILS' rate='4.1989'/>\n<Cube currency='INR' rate='73.0135'/>\n<Cube currency='KRW' rate='1249.16'/>\n<Cube currency='MXN' rate='20.4611'/>\n<Cube currency='MYR' rate='4.5846'/>\n<Cube currency='NZD' rate='1.5296'/>\n<Cube currency='PHP' rate='52.985'/>\n<Cube currency='SGD' rate='1.5211'/>\n<Cube currency='THB' rate='38.343'/>\n<Cube currency='ZAR' rate='15.1421'/>\n</Cube>\n</Cube>\n</gesmes:Envelope>";
//Fiction response

var returnString = '<select name="currencyOutput" id="currencyOutput">' + "\n";

jQuery(res).find("Cube").each(function(i, el) {
  var curr = jQuery(el).attr("currency");

  if (curr != void 0) {
    returnString += '<option id="currency' + i + '" value="' + curr + '">' + curr + '</option>' + "\n";
  }

})

returnString += '</select>';
jQuery("#output").html(returnString);
console.log(returnString)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="output"></div>