Şehirler Listesi

Merhaba, Aşağıda şehirler listesi var. Siteye eklediğinizde şehir seçimi yapabiliyorsunuz. Bir şehir seçtikten sonra o şehire verdiğim linke gitmesini istiyorum. Bu nasıl yapılır. Teşekkürler...

<select name="Sehir">
<option value="0">------</option>
<option value="1">Adana</option>
<option value="2">Adıyaman</option>
<option value="3">Afyonkarahisar</option>
<option value="4">Ağrı</option>
<option value="5">Amasya</option>
<option value="6">Ankara</option>
<option value="7">Antalya</option>
<option value="8">Artvin</option>
<option value="9">Aydın</option>
<option value="10">Balıkesir</option>
<option value="11">Bilecik</option>
<option value="12">Bingöl</option>
<option value="13">Bitlis</option>
<option value="14">Bolu</option>
<option value="15">Burdur</option>
<option value="16">Bursa</option>
<option value="17">Çanakkale</option>
<option value="18">Çankırı</option>
<option value="19">Çorum</option>
<option value="20">Denizli</option>
<option value="21">Diyarbakır</option>
<option value="22">Edirne</option>
<option value="23">Elazığ</option>
<option value="24">Erzincan</option>
<option value="25">Erzurum</option>
<option value="26">Eskişehir</option>
<option value="27">Gaziantep</option>
<option value="28">Giresun</option>
<option value="29">Gümüşhane</option>
<option value="30">Hakkâri</option>
<option value="31">Hatay</option>
<option value="32">Isparta</option>
<option value="33">Mersin</option>
<option value="34">İstanbul</option>
<option value="35">İzmir</option>
<option value="36">Kars</option>
<option value="37">Kastamonu</option>
<option value="38">Kayseri</option>
<option value="39">Kırklareli</option>
<option value="40">Kırşehir</option>
<option value="41">Kocaeli</option>
<option value="42">Konya</option>
<option value="43">Kütahya</option>
<option value="44">Malatya</option>
<option value="45">Manisa</option>
<option value="46">Kahramanmaraş</option>
<option value="47">Mardin</option>
<option value="48">Muğla</option>
<option value="49">Muş</option>
<option value="50">Nevşehir</option>
<option value="51">Niğde</option>
<option value="52">Ordu</option>
<option value="53">Rize</option>
<option value="54">Sakarya</option>
<option value="55">Samsun</option>
<option value="56">Siirt</option>
<option value="57">Sinop</option>
<option value="58">Sivas</option>
<option value="59">Tekirdağ</option>
<option value="60">Tokat</option>
<option value="61">Trabzon</option>
<option value="62">Tunceli</option>
<option value="63">Şanlıurfa</option>
<option value="64">Uşak</option>
<option value="65">Van</option>
<option value="66">Yozgat</option>
<option value="67">Zonguldak</option>
<option value="68">Aksaray</option>
<option value="69">Bayburt</option>
<option value="70">Karaman</option>
<option value="71">Kırıkkale</option>
<option value="72">Batman</option>
<option value="73">Şırnak</option>
<option value="74">Bartın</option>
<option value="75">Ardahan</option>
<option value="76">Iğdır</option>
<option value="77">Yalova</option>
<option value="78">Karabük</option>
<option value="79">Kilis</option>
<option value="80">Osmaniye</option>
<option value="81">Düzce</option>
</select>

document.querySelector('select[name="Sehir"]').addEventListener('change', (e) => {
     var val = e.target.value; // ALDIĞINIZ DEĞER BURAYA AKTARILACAK

     window.location = ''; // URL BURADA
});

Js kodunu ekledim sistem çalışıyor şehir seçtiğimde ama linkleri nasıl belirleyeceğim. Ankara seçince www.x.com/ankara linkine gitmesi için ne yapmam gerekiyor acaba?

<option value="78"><a href="wwwx.com/karabuk" class="link">Karabük</a></option> bu şekilde optionlara a değeri verebilirsin

var link = $(".link").val(); bu şekilde a değerini çekebilirsin jquery.

Çalıştıramadım, daha detaylı anlatabilirmisiniz.

Bu yanlış bir örnek, option içinde A tagı kullanılmaz, kullanılsada seçilen linke gitmez.


@klayt, @burak2yilmaz arkadaşın verdiği örneğe ek olarak aşağıdaki gibi düzenlemelisin ve option value kısımlarını isim yazacak şekilde değiştirmelisin.

document.querySelector('select[name="Sehir"]').addEventListener('change', (e) => {
     var val = e.target.value; // ALDIĞINIZ DEĞER BURAYA AKTARILACAK

     window.location = 'http://sitename.com/' + val; // URL BURADA
});

Hocam senin işini php ile çözelim kısaca

<form action="kontrol.php" method="post">
<select name="Sehir">
<option value="0">------</option>
<option value="1">Adana</option>
<option value="2">Adıyaman</option>
<option value="3">Afyonkarahisar</option>
<input type="submit" name="gonder">
</form>

html kodlarımızı bu şekilde yazdıktan sonra php'de bir kontrol sağlayacağız.

$gelen = $_POST['Sehir'];
header("Location: http://siteadresi.com/".$gelen.".html")

bu şekilde istediğinizi yapabilirsiniz. Eğer yapamazsanız söyleyin beraber yapalım.

İyi Çalışmalar.



Merhaba oradaki amaç aslında o şekilde değildi yanlış yazdım orayı zaten maksat jquery ile yakalayıp yönlendirmesi idi php ile hazır kodları ilettim arkadaşa

<option data-link="LINK BURADA OLACAK" value="1">Adana</option>

Optionlara link verebilirsin bu şekilde.

document.querySelector('select[name="Sehir"]').addEventListener('change', (e) => {
     window.location = e.target.getAttribure('data-link');
});

Bu Javascript kodu ile de o link'e yönlendirme yaparsın.

Arkadaşlar teşekkürler.

Başka bir sorum olacak 2 li seçim yapabilirmiyiz. Mesela Kişi il seçti Ankara, Sonra ikinci bir seçenek Renk seçti Mavi, git denildiğinde link www.x.com/ankara-mavi şeklinde iki seçeneği birleştirip link olarak gönderme imkanımız varmı?