Hej,
Mam kod w 'czystym' JavaScripcie i chciałbym zrobić działający analogicznie przy użyciu jQuery, ale nie radzę sobie "przenoszeniem zaznaczenia" z listy na checkboxa.
Są 3 checkboxy podpisane nazwami kolorów, na drop down liście mam takie same kolory, jeśli zaznaczę chceckbox z kolorem to ten sam kolor zostaje wybrany na drop down liście, a jeśli zaznaczę na liście to zaznacza się chceckbox z tym kolorem.
<!DOCTYPE html>
<html>
<body>
<script type="text/javascript">
function zaznaczBox(id) {
for (var i = 1;i <= 3; i++)
{
document.getElementById(i).checked = false;
}
document.getElementById(id).checked = true;
document.getElementById('lista').selectedIndex = id-1;
}
function zaznaczSelect(){
zaznaczBox(document.getElementById('lista').selectedIndex+1);
}
</script>
<input type="checkbox" id='1' onclick="zaznaczBox(1)" />Czerwony</label>
<input type="checkbox" id='2' onclick="zaznaczBox(2)" checked />Niebieski</label>
<input type="checkbox" id='3' onclick="zaznaczBox(3)" />Zielony</label>
<select id="lista" onclick="zaznaczSelect()">
<option>Czerwony</option>
<option selected>Niebieski</option>
<option>Zielony</option>
</select>
</body>
</html>
W jQuery na razie mam coś takiego
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(function box () {
$('input:checkbox').click(function () {
if ($(this).is(':checked')) {
$('input:checkbox').not(this).prop('checked', false);
var index = this.id;
$('select#lista').prop('selectedIndex',index);
}
});
})
</script>
</head>
<body>
<input type="checkbox" id='0' />Czerwony</label>
<input type="checkbox" id='1' checked />Niebieski</label>
<input type="checkbox" id='2' />Zielony</label>
<select id="lista">
<option>Czerwony</option>
<option selected>Niebieski</option>
<option>Zielony</option>
</select>
</body>
</html>