How to make when selecting li item has varied coordinates on Yandex maps?

Welcome colleagues! The crux of the matter, there is a dropdown list ul li in which you can select several cities , you need to label coordinates on Yandex the map to automatically change when you select a city from the list. Please help preferably with a specific example. Thanks in advance :)

UPD: sorry not the city, not put it right. There are offices in different cities. And when you select a valid city from the dropdown list on the website changes the phone number, email, address. But since there contains and map logical to change the map. Ie in fact I need to send some kind of signal Yandex map so she changed the focus point to other coordinates.
July 8th 19 at 12:07
2 answers
July 8th 19 at 12:09
Solution
Thank you, I did. I needed this.

<ul class="city-box">
 <li class="city-inside-box">Your city <span class="city-style">Novosibirsk</span><i class="fa fa-sort-desc" aria-hidden="true"></i></li>
 <ul class="cities_list">
 <li alt="St. B. Bogatkova, d. 24/1" phone="8 (383) 201-85-75" email="info@sib-nsk.net" id="novosibirsk">Novosibirsk</li>
 <li alt=", Krylov str., 47A, of. 607" phone="8 (3902) 34-76-90" email="abakan@sib-nsk.net" id="abakan">Abakan</li>
 <li alt="street Lapina, d. 8, of. 15" phone="8 (3952) 64-01-63" email="irkutsk@sib-nsk.net" id="irkutsk">Irkutsk</li>
 <li alt="St. brindle, d. 29, of. 11 " phone="8 (4232) 50-26-42" email="prim@sib-nsk.net" id="vladivostok">Vladivostok</li>

</ul>

 <li class="phone-box"><i class="fa fa-mobile" aria-hidden="true"></i><span> 8 (383) 201-85-75</span></li>
 <li class="mail-box"><i class="fa fa-envelope" aria-hidden="true"></i><span>info@sib-nsk.net</span></li>
 <li class="marker-box"><i class="fa fa-map-marker" aria-hidden="true"></i><a href="#maps"><span>St. B. Bogatkova, d. 24/1</span></a></li>

 </ul>

ymaps.ready(function () {
 var myMap = new ymaps.Map('map', {
 center: [55.010906, 82.944415],
 zoom: 14
 }, {
 searchControlProvider: 'yandex#search'
}),
 myPlacemark = new ymaps.Placemark(myMap.getCenter(), {
 hintContent: 'OOO Sib',
 balloonContent: 'Ul.Boris Bogatkova 24/1'
});
 document.getElementById('irkutsk').onclick = function () {
 // To destroy the destroy method is used.
 myMap.setCenter([52.279611, 104.285547], 15, {
 searchControlProvider: 'yandex#search'
});
 myPlacemark = new ymaps.Placemark(myMap.getCenter(), {
 hintContent: 'OOO Sib',
 balloonContent: 'street Lapina, d. 8, of. 15'
});
myMap.geoObjects.add(myPlacemark);
myPlacemark.balloon.open();
};
 document.getElementById('abakan').onclick = function () {
 // To destroy the destroy method is used.
 myMap.setCenter([53.733745, 91.437465], 15, {
 searchControlProvider: 'yandex#search'
});
 myPlacemark = new ymaps.Placemark(myMap.getCenter(), {
 hintContent: 'OOO Sib',
 balloonContent: 'Krylov str., 47A, of. 607'
});
myMap.geoObjects.add(myPlacemark);
myPlacemark.balloon.open();
};
 document.getElementById('vladivostok').onclick = function () {
 // To destroy the destroy method is used.
 myMap.setCenter([43.116687, 131.878954], 15, {
 searchControlProvider: 'yandex#search'
});
 myPlacemark = new ymaps.Placemark(myMap.getCenter(), {
 hintContent: 'OOO Sib',
 balloonContent: 'str brindle, d. 29, of. 11'
});
myMap.geoObjects.add(myPlacemark);
myPlacemark.balloon.open();
};
 document.getElementById('novosibirsk').onclick = function () {
 // To destroy the destroy method is used.
 myMap.setCenter([55.010906, 82.944415], 14, {
 searchControlProvider: 'yandex#search'
});
 myPlacemark = new ymaps.Placemark(myMap.getCenter(), {
 hintContent: 'OOO Sib',
 balloonContent: 'Ul.Boris Bogatkova 24/1'
});
myMap.geoObjects.add(myPlacemark);
myPlacemark.balloon.open();
};
myMap.geoObjects.add(myPlacemark);
myPlacemark.balloon.open();
});
July 8th 19 at 12:11
If it is supposed to choose the city, then you can use the geocode. It returns a promise, when resolve which you can specify the coordinates of the center of the map, taken from the received geo.
I do understand the question?)
I tried to use yandeksovsky the geocode. Worse had ever seen.. For the test took a few addresses, Yandex does not have a normal coordinates on any of them, while Google maps all recognized correctly. - ruben.Bosco commented on July 8th 19 at 12:14
I agree, therefore, "If the choice is supposed of the city." He finds them correctly... usually) - courtney_Emmerich commented on July 8th 19 at 12:17
unfortunately not the city, not put it right. There are offices in different cities. And when you select a valid city from the dropdown list on the website changes the phone number, email, address. But since there contains and map logical to change the map. Ie in fact I need to send some kind of signal Yandex map so she changed the focus point to other coordinates. - Brendan_Hodkiewicz commented on July 8th 19 at 12:20
: Well, this time the offices, the lot of them of course and determined in advance. Just get the essence of "the office", which among other things is property "address", or "coordinates". Next, map each element from the list of such entities, the list item in the DOM and change the coordinates. Exactly, unfortunately, it is difficult to say, because I do not know what you are using a framework and using it at all. If at all in the forehead, you can put the coordinates in a data attribute on click... you know - courtney_Emmerich commented on July 8th 19 at 12:23

Find more questions by tags HTMLJavaScriptCSSYandex.Maps