İl ilçe seçme javascript olayı ios safaride çalışmıyor

15-05-2020, 19:08:27

Kimlik doğrulama veya yönetimden onay bekliyor.

İl İlçe seçim uygulaması yapıyordum. Ajax post felan kullanmadan bu tarz bir çalışma var. Masaüstü tarayıcılarda çalışan uygulama maalesef ios safaride çalışmıyor. Select işlemlerinde istenilen javascriptler ios'ta tetiklenmiyor. İndex ve javascript kodlarım aşağıdadır. Yardım edebilir misiniz.

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta name="language" content="tr">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta content="" name="author" />
    <meta name="title" content="">
    <meta name="description" content="">
    <meta name="keywords" content="">    
    <title>İl-İlce</title>
<link rel="stylesheet" href="../docs/dist/css/bootstrap.min.css">
</head>

<body>
    <div class="container">
        <div class="form-group col-md-6">
            <label>İl</label>
            <select class="form-control" id="iller" name="iller">
                <option value="">Seçiniz</option>
                <option value="11" slug="1">İstanbul</option>
                <option value="12" slug="2">Ankara</option>
            </select>
        </div>
        <div class="form-group col-md-6">
            <label>İlçe</label>
            <select class="form-control" id="ilceler" name="ilceler">
                <option value="">Seçiniz</option>
                <option value="21" il-slug="1">Bayrampaşa</option>
                <option value="22" il-slug="1">Beyoğlu</option>
                <option value="23" il-slug="1">Fatih</option>
                <option value="24" il-slug="2">Sincan</option>
                <option value="25" il-slug="2">Mamak</option>
            </select>
        </div>
    </div>

    

</body>
</html>

jquery-3.3.1.js

 
 
  
$(document).ready(function(){
        $(function(){
         $("#ilceler option").hide();
            $("#iller").change(function(){
                $('[name="ilceler"]').val("");
                $("#ilceler option").hide();
                var slug = $("#iller option:selected").attr("slug");
                if(slug){
                $("#ilceler option[il-slug='"+slug+"']").show();
                }
            });
        });
    });

16-05-2020, 01:04:59

#2

iyovi

@fatihbozkurt; Herhangi bir link altında çalışıyor ise linkide ekler misiniz? Kontrol edelim eğer link altında değilse link altına alabiliyorsanız alın hocam.

16-05-2020, 02:00:01

#3

iyovi

@fatihbozkurt; Ufak bir araştırma yaptım senin için öncelikle şunu belirtmek isterim ki safari ve operada html elementleri ile ilgili herhangi bir css işlemi gerçekleştiremiyorsunuz yani şu mesela hide() uyguluyorsun tarayıcı bunu display:none olarak algıladığı için buna izin vermiyor lakin remove() işlemini yapabiliyorsun sana aşağıda bir kod bırakıyorum bunu ben test ettim çalışıyor lakin bunu kendine göre düzenlemen gerekecek.

$(function(){
        $("select#iller").change(function(){
            var slug = $("#iller option:selected").attr("slug");
            $("select#ilceler option:not([il_slug='"+slug+"'])").remove();
        });
    });

16-05-2020, 02:47:32

#4

fatihbozkurt

DPA adlı üyeden alıntı: mesajı görüntüle

@fatihbozkurt; Ufak bir araştırma yaptım senin için öncelikle şunu belirtmek isterim ki safari ve operada html elementleri ile ilgili herhangi bir css işlemi gerçekleştiremiyorsunuz yani şu mesela hide() uyguluyorsun tarayıcı bunu display:none olarak algıladığı için buna izin vermiyor lakin remove() işlemini yapabiliyorsun sana aşağıda bir kod bırakıyorum bunu ben test ettim çalışıyor lakin bunu kendine göre düzenlemen gerekecek.

$(function(){
        $("select#iller").change(function(){
            var slug = $("#iller option:selected").attr("slug");
            $("select#ilceler option:not([il_slug='"+slug+"'])").remove();
        });
});

Aşağıdaki şekilde yapınca ilk seçimi yaptığımda düzgün çalışıyor fakat tekrardan bir il seçmeye çalışınca çalışmıyor. Sayfa ilk yüklendiğinde düzgün çalışıyor sayfayı yenilemeden tekrar seçim yapınca fonksiyon çalışmıyor.

    $(document).ready(function(){
        $("#iller").change(function(){
            var slug = $("#iller option:selected").attr("slug");
            $("#ilceler option:not([il-slug="+slug+"])").remove();
        });
    });

16-05-2020, 02:53:40

#5

iyovi

Evet biliyorum bundan dolayı bunu Ajax ile yapmalısın çünkü tüm verileri getirip bu şekilde işlem yaptırırsan safari ve opera tarayıcılarında problem yaşayacaksın. En sağlıklısı Ajax ile olacaktır senin için internetten bu konuyla ilgili makaleleri okuyabilirsin hatta hazır modüller var araştırırsan bulacaksındır. @fatihbozkurt;