簡単なこともできなくてかなちみ…

やりたいこと

• プルダウンAで選んだ情報からプルダウンBの内容を絞り込む
  • プルダウンA：地域
  • プルダウンB：店舗名

できたこと

• ひとまず地域と店舗名で配列を作成
• 選択した地域から該当する店舗を取得⇒でも配列で出てきちゃう！！
  • 理想は取得できたshopと合致するvalueのoptionをshow();にすること…あたまが爆発しそう…

<script>
var shop_data = [
   {area: '関東・甲信越', shop:'池袋店'},
   {area: '関東・甲信越', shop:'有楽町店'},
   {area: '中部', shop:'静岡店'},
   {area: '中部', shop:'名古屋店'},
   {area: '関西', shop:'京都店'},
   {area: '関西', shop:'なんば店'},
   {area: '中国・四国', shop:'山口店'},
   {area: '中国・四国', shop:'広島店'}
   {area: '九州・沖縄', shop:'沖縄'}
]
function select_area(area_name){
    // 選択された地域をarea_nameに代入
    area_name=area_name.value
    if(area_name == ""||area_name == "初めて利用"){
        // 未選択or初めて利用を選択したらすべての店舗を表示
        $('select[name="USE_SHOP_TENPO"] option:not(:first-child)').show();
    }else{
        // 地域を選択したらすべて非表示
        $('select[name="USE_SHOP_TENPO"] option:not(:first-child)').hide();		
        // 配列のarea名と同じものを表示させる
            // test 地域名が合致する店舗名を吐き出す
            console.log(shop_data.filter(shop_name => shop_name.area == area_name));
    }
}
</script>

いけたああああああああああああああああ

function select_area(area_name){
    // 選択された地域をarea_nameに代入
    area_name=area_name.value
    if(area_name == ""||area_name == "初めて利用"){
        // 未選択or初めて利用を選択したらすべての店舗を表示
        $('select[name="USE_SHOP_TENPO"] option:not(:first-child)').show();
    }else{
        // 地域を選択したらすべて非表示
        $('select[name="USE_SHOP_TENPO"] option:not(:first-child)').hide();		
        // 配列のarea名と同じものを表示させる
        var selected_area_shops = shop_data.filter(shop_name => shop_name.area == area_name)
        // 配列を順に処理
        $.each(selected_area_shops,
        function(index, val) {
            $('select[name="USE_SHOP_TENPO"] option[value="'+val.shop +'"]').show();
                }
            );
    }
}