Currency converter PHP echo in pop-up

Question

I don't know how I can do popup with result in my currency converter with API http://api.nbp.pl/ . This is my code:

<?php

if (isset($_POST['kwota']) && isset($_POST['waluta']) && is_numeric($_POST['kwota']) && is_numeric($_POST['waluta'] )){
switch ($_POST['waluta']) {
case 1:
$przelicznik = json_decode(file_get_contents('http://api.nbp.pl/api/exchangerates/rates/a/usd/'))->rates[0]->mid;
break;
case 2:
$przelicznik = json_decode(file_get_contents('http://api.nbp.pl/api/exchangerates/rates/a/eur/'))->rates[0]->mid;
break;
case 3:
$przelicznik = json_decode(file_get_contents('http://api.nbp.pl/api/exchangerates/rates/a/jpy/'))->rates[0]->mid;
break;
case 4:
$przelicznik = json_decode(file_get_contents('http://api.nbp.pl/api/exchangerates/rates/a/gbp/'))->rates[0]->mid;
break;
case 5:
$przelicznik = json_decode(file_get_contents('http://api.nbp.pl/api/exchangerates/rates/a/aud/'))->rates[0]->mid;
break;
default:
$przelicznik = 1;
}

$wynik = $_POST['kwota']/$przelicznik;
echo $wynik;
}

?>

Answer 1

The API is public, so you tecnically don't need PHP to do so, you can fetch the exchange rate and show the results using javascript/jQuery directly. Here's an example on how to do so using jQuery:

<form id="exchange">
    <input type="text" name="price" title="price">
    <select name="currency" title="currency">
        <option value="1">USD</option>
        <option value="2">EUR</option>
        <option value="3">JPY</option>
        <option value="4">GBP</option>
        <option value="5">AUD</option>
    </select>
    <input type="submit" value="calculate">
</form>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
    $('#exchange').on('submit',function(e){
        e.preventDefault();
        var value = $(this).find('[name="price"]').val();
        if(!value) {
            alert("Insert a valid value");
            return false;
        }
        switch ($(this).find('[name="currency"]').val()) {
            case "1":
                $link = 'http://api.nbp.pl/api/exchangerates/rates/a/usd/';
                break;
            case "2":
                $link = 'http://api.nbp.pl/api/exchangerates/rates/a/eur/';
                break;
            case "3":
                $link = 'http://api.nbp.pl/api/exchangerates/rates/a/jpy/';
                break;
            case "4":
                $link = 'http://api.nbp.pl/api/exchangerates/rates/a/gbp/';
                break;
            case "5":
                $link = 'http://api.nbp.pl/api/exchangerates/rates/a/aud/';
                break;
            default:
                alert('Error');
                return false;
        }
        console.log($link);
        $.getJSON($link,function(result){
            alert(value/result.rates[0].mid);
        });
    });
</script>