javascript - Change selected option when clicked -
what trying achieve follows:
when user changes selected value in select box, refresh page, add selected text value existing url , reset select box default value selected user before page refresh.
any ideas doing wrong?
html code:
<select class="selectedform"> <option value="one" selected>one</option> <option value="two">two</option> <option value="three">three</option> <option value="four">four</option> </select>
javascript code:
$(".selectedform").change(function() { $('.selectedform option:contains(' + this.value + ')').prop({selected: true}); alert( $('.selectedform').find(":selected").val() ); if ( window.location.href.indexof("&") > -1 ) { window.location.search = '?towhere=cursos&q='+$('.selectedform').find(":selected").text(); } else { window.location.search += '&q='+$('.selectedform').find(":selected").text(); } });
to preserve value of selector after reload use like:
$(".selectedform").on('change', function() { var _loc = string(location.href) ,loc = _loc.substr(0, _loc.lastindexof('/')); self.location.href = loc + '?selected='+this.value; }); // handler load selected option on page load function loadselectedopt() { var loc = location.search; if (loc.length) { $(".selectedform").val(loc.split('=')[1]); } }
in words: add selected option value querystring of current location (?selected=[selected value]
), reload page, , use querystring set value of selector when page reloaded.
here's jsfiddle demo
Comments
Post a Comment