Liste kutusunda karşılık gelen değerleri aşağıya açılan değerde tıklatarak

Question

Değerleri aşağı açılır formda alıyorum json'um ve açılır listeden bir değeri tıklattıktan sonra liste kutusu shud'unu dolduruyorum. örneğin, Aşağıdaki gibi benim json dosyamı şimdi 1. açılana kadar değer alıyorum görebildiğim gibi saklamıyorum, sakınmak istiyorum .. Eğer liste kutusunda obs'e tıklarsam brs1, crs1, drs1 olsun istiyorum.

$(document).ready(function() { 

    $.getJSON("data.json",function(obj) { 
    var jsObject = $.parseJSON(obj); 
     var usedNames = []; 
     $.each(obj, function(key, value) { 
      if (usedNames.indexOf(value.name) == -1) { 
       $("#dropdown1").append("<option value=" + key + ">" + value.name + "</option>"); 
       usedNames.push(value.name); 
      } 
    $('<option>', { 
     text: 'Select your Option', 
     value: '', 
     selected: 'selected', 
     disabled: 'disabled' 
    }).appendTo('#dropdown1'); 

    $.each(jsObject, function (index, value) { 
     $('<option>', { 
      text: value['name'], 
      value: index 
     }).appendTo('#dropdown1'); 
    }); 

    $('<option>', { 
     text: 'Select your List Option', 
     value: '', 
     selected: 'selected', 
     disabled: 'disabled' 
    }).appendTo('#listbox'); 


    $('#dropdown1').change(function() { 
     $('#listbox').empty(); 

     $('<option>', { 
      text: 'Select your List Option', 
      value: '', 
      selected: 'selected', 
      disabled: 'disabled' 
     }).appendTo('#listbox'); 

     var selection = $('#dropdown1 :selected').text(); 
     $.each(jsObject, function (index, value) { 
      if (value['name'] === selection) { 
       $('<option>', { 
        text: value['attr001'], 
        value: 'attr001' 
       }).appendTo('#listbox'); 
       $('<option>', { 
        text: value['attr002'], 
        value: 'attr002' 
       }).appendTo('#listbox'); 
       $('<option>', { 
        text: value['attr003'], 
        value: 'attr003' 
       }).appendTo('#listbox'); 
      } 
     }); 
    }); 
}); 

Benim html

<form name="myform" id="myForm"> 

    <select id="dropdown1"></select> 
    <select id="listbox"></select> 
    <br> 

şey önermek Lütfen gibi

[{ 
    "name": "obs", 
    "date": "1458834026000", 
    "attr001": "brs1", 
    "attr002": "crs1", 
    "attr003": "drs1", 
}, { 
    "name": "hid", 
    "date": "1458774000000", 
    "attr001": "ffrs1", 
    "attr002": "grrs1", 
    "attr003": "mno1", 
}, { 
    "name": "qwe", 
    "date": "1425744000000", 
    "attr001": "klm1", 
    "attr002": "wer1", 
    "attr003": "iop1", 
}, { 
    "name": "rty", 
    "date": "1458774000000", 
    "attr001": "yrs1", 
    "attr002": "qws1", 
    "attr003": "prs1" 
}] 

Benim javascript dosyasıdır ..

Answer 1

bu

$.getJSON("data.json",function(obj) { 

var json_string = '[{"name":"obs","date":"1458834026000","attr001":"brs1","attr002":"crs1","attr003":"drs1"},{"name":"hid","date":"1458774000000","attr001":"ffrs1","attr002":"grrs1","attr003":"mno1"},{"name":"qwe","date":"1425744000000","attr001":"klm1","attr002":"wer1","attr003":"iop1"},{"name":"rty","date":"1458774000000","attr001":"yrs1","attr002":"qws1","attr003":"prs1"}]'; 
var jsObject = $.parseJSON(json_string); 
// var jsObject = $.parseJSON(obj); // Assuming yout obj contains the JSON Stirng 

$('<option>', { 
    text: 'Select your Option', 
    value: '', 
    selected: 'selected', 
    disabled: 'disabled' 
}).appendTo('#dropdown1'); 

$.each(jsObject, function (index, value) { 
    $('<option>', { 
     text: value['name'], 
     value: index 
    }).appendTo('#dropdown1'); 
}); 

$('<option>', { 
    text: 'Select your List Option', 
    value: '', 
    selected: 'selected', 
    disabled: 'disabled' 
}).appendTo('#listbox'); 


$('#dropdown1').change(function() { 
    $('#listbox').empty(); 

    $('<option>', { 
     text: 'Select your List Option', 
     value: '', 
     selected: 'selected', 
     disabled: 'disabled' 
    }).appendTo('#listbox'); 

    var selection = $('#dropdown1 :selected').text(); 
    $.each(jsObject, function (index, value) { 
     if (value['name'] === selection) { 
      $('<option>', { 
       text: value['attr001'], 
       value: 'attr001' 
      }).appendTo('#listbox'); 
      $('<option>', { 
       text: value['attr002'], 
       value: 'attr002' 
      }).appendTo('#listbox'); 
      $('<option>', { 
       text: value['attr003'], 
       value: 'attr003' 
      }).appendTo('#listbox'); 
     } 
    }); 
}); 

deneyin .. teşekkürler İşte

}

Fiddle

Answer 2

Kullanım Kimliği ve sınıf Asistan

$('.dropdown').on('change', function(){ 
    ele = $(this).attr('id'); 
}) 

gibi HTML sınıfına tıklama dayalı bir seçici yapmak daha

$("#dropdown1").append("<option id=" + value.name + " class="dropdown" value=" + key + ">" + value.name + "</option>"); 

oluştururken çok zaman isme göre tüm elemanın ismini almak ve liste kutusu doldurmak için json'unuzu ayrıştırmaktan çok, seçilen elemanın ismine sahip olacaktır. Bu veriler