Bu yazıda jQuery kullanılarak selectbox’a verinin nasıl aktarılacağını göstereceğim. Selectbox içerisine veri nasıl çekilir, dizi elemanlarını selectbox’a eklemeyi aynı zamanda selectbox’a options ekleme olayını da aşağıda canlı demo ve kaynak kodları ile birlikte görebilirsiniz.
Canlı Demo
Aşağıdaki kaynak kodlar “Html + CSS + JS “ ile birlikte verilmiştir. Tümünü kopyalayıp “.html” şeklinde kayıt ettiğinizde hemen çalıştırabilirsiniz.
KAYNAK KODLAR İÇİN
<html>
<head>
<script src="http://code.jquery.com/jquery-2.1.1.js"></script>
<TITLE>Js Diziyi Selectbox'a aktarma </TITLE>
</head>
<body>
<div style="border: 1px solid green; height:140px; width:300px;">
<div style="text-align:center;" id="diziElemanlari"></div><br><br>
<select id="selectID">
<option selected value="-1">Lütfen Seçiniz</option>
</select>
<button id="selectGonder">Diziyi İçeri Aktar</button>
</div>
<script type="text/javascript">
var dizi=["Elma","Armut","Üzüm","Kavun"];
$("#diziElemanlari").append("<b style='color:darkred;'>Dizideki Elemanlar:</b><br>" + dizi);
$("#selectGonder").on("click", function(){
var options='<option value="-1" selected="selected">Lütfen Seçiniz</option>';
for (var item in dizi ) {
options +="<option value='" + item + "'>" + dizi[item] + "</option>";
}
$("#selectID").html(options);
});
</script>
</body>
</html>
