javascript - Using a select box to swap classes between divs -
i have 5 divs, each containing select box lists divs. trying make when use select box swaps class of div using the div selected.
i have set classes change column position using css flex.
so far work correctly on first change not on after that. doing wrong here?
fiddle:https://jsfiddle.net/wd9vrfmn/
jq:
var col = ['col1', 'col2', 'col3', 'col4', 'col5'] //list of classes $("select").change(function(){ var prevclass = $(this).parent().attr('class'); var nextclass = col[$(this).val() - 1]; $(this).val($(this).find('option[selected]').val()); $('div.' + prevclass).removeclass(prevclass).addclass("col0"); $('div.' + nextclass).removeclass(nextclass).addclass(prevclass); $('div.col0').removeclass("col0").addclass(nextclass); });
the value
of options not getting updated. have added following code:
var previd = $(this).parent().attr('class').replace("col",""); var nextid = $(this).val(); var prevelem = $("option[value="+previd+"]"); var nextelem = $("option[value="+nextid+"]"); $(prevelem).val(nextid); $(nextelem).val(previd);
please refer fiddle.
Comments
Post a Comment