CODEWITHSUNDEEP
javascriptarrays
angelzzz
angelzzz

Reputation: 167

How to match text from select with array in js?

I have select with few options

<select id="delivery">
 <option>London</option>
 <option>Berlin</option>
 <option>Paris</option>
</select>

I have such js

$(document).ready(function () {
 function valParam () {
  var cities = [
   { city: 'London', koef: 1, mag: 34.2},
   { city: 'Berlin', koef: 1.25, mag: 34.2},
   { city: 'Paris', koef: 1.25, mag: 11.7}
  ];    
  var text= $('#text').val(); 
  };    

  $('.calculator').on('change', valParam);

})

I need to get koef and mag from arr which match to text in selected option. After that I need to use this values in calcultaions result = (text + koef) * mag

How to match text from select with array in js and save these values?

Upvotes: 0

Views: 866

Answers (5)

Matthew Herbst
Matthew Herbst

Reputation: 32043

Turn your cities array into an object/map and just use the name of the city as the key:

var cities = {
  'London': { koef: 1, mag: 34.2 },
  'Berlin': { koef: 1.25, mag: 34.2 },
  'Paris': { koef: 1.25, mag: 11.7 },
  'New York': {...}
};

Then all you need to do is:

var selectedOption = $( "#delivery option:selected" ).text();
var cityData = cities[selectedOption];
var result = (text + cityData.koef) * cityData.mag;

// Note that I'm a bit confused by your formula since you can't multiple strings, and I'm assuming here that text is a string?

Upvotes: 0

Sabaz
Sabaz

Reputation: 5312

I'll assume that #text is an input which contains a numeric value
(you didn't write anything about it in the question) 

$(document).ready(function () {

    function valParam () {
        var city = $('#delivery').val();
        var text = parseFloat($('#text').val()); 
        var result = null;
        var cities = [
            { city: 'London', koef: 1, mag: 34.2},
            { city: 'Berlin', koef: 1.25, mag: 34.2},
            { city: 'Paris', koef: 1.25, mag: 11.7}
        ];    

        for (var ind = 0, ln = cities.length; ind < ln; ind++){
            if (cities[ind].city === city){
                result = (text + cities[ind].koef) * cities[ind].mag;     
                break;
            }
        }

        // here 'result' should have the calc you need.
        alert(result);
    };    

    $('.calculator').on('change', valParam);

})

I can't create a properly JsFiddle because I do not even know what is .calculator too, but HERE a "workaround" of my above code for testing .

Code Tests:
if #text value is 3 ..
- London result = 136.8
- Berlin result = 145.35000000000002
- Paris result = 49.724999999999994

Upvotes: 1

Shai UI
Shai UI

Reputation: 51978

var cities = [
   { city: 'London', koef: 1, mag: 34.2},
   { city: 'Berlin', koef: 1.25, mag: 34.2},
   { city: 'Paris', koef: 1.25, mag: 11.7}
  ];  

  $('#delivery').on('change', function() {  
    cities.forEach(function(obj)
    {
      if (obj.city == $('#delivery').val())
        {
          
           var res = (parseFloat($('#text').val())
 + obj.koef) * obj.mag;
          
           $('#result').html(res);
             
        }
      
    });
  });

// initialize it
$('#delivery').val('London').trigger('change');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<select id="delivery">
 <option>London</option>
 <option>Berlin</option>
 <option>Paris</option>
</select>

<input id='text' value='3'>
<div id='result'></div>

Upvotes: 0

dvenkatsagar
dvenkatsagar

Reputation: 936

I think this should do the trick ...

$.each(cities,function(i,c){
  if(c.city == $("#delivery option:selected").text()){
    // do something here
    result = (text + c.koef)*c.mag;
  }
});

hope it helps

Upvotes: 0

ranjanm28
ranjanm28

Reputation: 99

If you have selected option from the dropdown then it will look like this-

<select id="delivery">
 <option>London</option>
 <option selected="selected">Berlin</option>
 <option>Paris</option>
</select>

you can get the value of selected option from the below code-

var e = document.getElementById("delivery");
var strUser = e.options[e.selectedIndex].text;

After this you have to match this text value by iterating your array in valParam() function and you can get value of koef and mag easily.

I think above will solve your query.

Upvotes: 0

Related Questions