How to get the previous selected value from a dropdown before onchange
You could include a hidden input field on your page
<input type="hidden" id="previous_value" name"previous_value" value="abc"/>
Then in your script you could access as any other input:
var previous = $('#previous_value').val();
Set it after an onchange event occurs:
$('#statustab_{{ $row['placementkey'] }}').addEventListener('change', function (e) {
$('$previous_value').val(e.value)
})
- Use the
data-*
to store the old value - Get the
data-*
as the old value and the selected option as new value
$('select').change(function(){
var oldvar = $(this).attr('data-old') !== typeof undefined? $(this).attr('data-old') :"";
var newval = $("option:selected",this).text();
$(this).attr('data-old',newval)
console.log("prev value :" + oldvar)
console.log("curr value :" + newval)
}).change();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select>
<option>1</option>
<option>2</option>
<option>3</option>
</select>
Save the original value using data()
when the element gets focus:
$('.select2-selecting').on('focusin', function(){
console.log("Saving value " + $(this).val());
$(this).data('val', $(this).val());
});
And then get the saved old value in your onchange
function:
function listingByStatus(ths,key){
var thisSelect = $('#statustab_'+key).text();
var statusText = $( "#statustab_"+key+" option:selected" ).text();
var currentval = $( "#statustab_"+key+" option:selected" ).val();
var prev = $('.select2-selecting').data('val'); //old value
console.log("Old value " + prev);
}
Try below code. Hope it will help you.
$('select').change(function(){
var oldval = $(this).prop('data-old') !== undefined ? $(this).prop('data-old') : "";
var newval = $("option:selected",this).text();
console.log("previous value : " + oldval);
console.log("current value : " + newval);
$(this).prop('data-old',newval);
}).change();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select>
<option>Apple</option>
<option>Mango</option>
<option>Banana</option>
<option>Orange</option>
</select>