Question

http://jsfiddle.net/6mMUs/

I want to have live currency rate inputs for Euros, Dollars and Pounds.

<input type="text" id="eurorate" style="margin-bottom:15px;"> Euros <br />
<input type="text" id="dollarrate" style="margin-bottom:15px;"> Dollars <br />
<input type="text" id="poundrate" style="margin-bottom:15px;"> Pounds

What's the proper way of assigning a multiplier to each of these 3 currencies and have them respond to change in ANY of the inputs in real time?

for example, if a dollar is 0.75 euros and it is 0.60 Pounds, when I enter '1' in the dollar field, the other fields should show the correct values when converted to the other currencies.

I tried doing this with setInterval but it is not truly real time, I want to know what's the proper alternative using keyup or something like that.

Any help is appreciated.

Was it helpful?

Solution

Use an onkeyup event on your input fields, and when the event fires you update the other ones.

OTHER TIPS

A simple Method to Covert Currency

            <html>
        <head>
        <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
         <script>
        function changeTo(toType){
        
          
          if(toType=="Pound")
                cvrate = 0.86;
          else
                cvrate = 0.78;      
                
                        
          $(".currency_change").each(function (index, element) {
               var og_val  = $(this).data("og-value");
               var cvd_val = (og_val*cvrate).toFixed(2);
               return $(this).html(cvd_val);  
            });
            }
        </script>  
        
        </head>
        <body>
        <br /><span class="currency_change" data-og-value="1254">1254</span>
        <br /><span class="currency_change" data-og-value="145">145</span>
        <br /><span class="currency_change" data-og-value="54">54</span>
        <br /><span class="currency_change" data-og-value="254">254</span>
        <br /><span class="currency_change" data-og-value="147">147</span><br />
        <button onClick="changeTo('Pound');">Conver To Pound</button>
        <button onClick="changeTo('Euro');">Conver To Euro</button>
        </body>
        </html>

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top