Как подставлять значения вместо реального?

Question

[kursof]

Есть города, с автоподгрузкой

var states = ['Киев', 'Москва', 'Токио'];
при выборе города они в input устанавливаются как написано выше типа Киев и т.д. а нужно что бы устанавливалось в виде

var states = ['kiev', 'moscow', 'tokio' ];
но пользователь это видеть не должен

var substringMatcher = function(strs) {
  return function findMatches(q, cb) {
    var matches, substringRegex;

    // an array that will be populated with substring matches
    matches = [];

    // regex used to determine if a string contains the substring `q`
    substrRegex = new RegExp(q, 'i');

    // iterate through the pool of strings and for any string that
    // contains the substring `q`, add it to the `matches` array
    $.each(strs, function(i, str) {
      if (substrRegex.test(str)) {
        matches.push(str);
      }
    });

    cb(matches);
  };
};

var states = ['Киев', 'Москва', 'Токио'
];
 
$('#the-basics .typeahead').typeahead({
  hint: true,
  highlight: true,
  minLength: 1
},
{
  name: 'states',
  source: substringMatcher(states)
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/typeahead.js/0.11.1/typeahead.bundle.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://twitter.github.io/typeahead.js/css/examples.css" />
<div id="the-basics">
  <input class="typeahead" type="text" placeholder="ГОРОД">
</div>

https://jsfiddle.net/mbaoe66f/

Answer 1

[kursof]

jsfiddle.net/7z9qA
решение

Answer 2

[xmoonlight]

Вот.