Getting Value of Select (Dropdown) Before Change

Getting value of select (dropdown) before change

Combine the focus event with the change event to achieve what you want:

(function () {
    var previous;

    $("select").on('focus', function () {
        // Store the current value on focus and on change
        previous = this.value;
    }).change(function() {
        // Do something with the previous value after the change
        alert(previous);

        // Make sure the previous value is updated
        previous = this.value;
    });
})();

Working example: http://jsfiddle.net/x5PKf/766

How to get the previous selected value from a dropdown before onchange

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);
}

Get previous value of dropdown after onchange event jQuery

Best way to do it by jquery :

  $(document).ready(function(){
        var previous;
         $("#Diabetes_UK_3147").on("focus click",function () {
            previous = this.value; // Old vaue 

        }).change(function() {
        var value =  this.value; // New Value
          $('span').text('Old Value : '+previous+' New Value : '+value)
        });

    })

here the fiddle http://jsfiddle.net/Laa2hL3b/

Edited : in auto-Generated dropdown you can add a custom class for example "myselectbox"

<select class="form-control  myselectbox"

and make change here

  $(".myselectbox").on(/* other code remain same */

get selected option before onchange

You can store the value in the element's data on a focus event.

e.g. something like:

$('.selecttag').on('focus', function(){
   $(this).data("value", $(this).val());
})

then in the change event you get the data("value") back.

e.g.

$('.selecttag').on('change', function(){
   var orig = $(this).data("value");
   var newVal = $(this).val();
   // Save the newer value 
   $(this).data("value", $(this).val());
   // Do something with both values!
});

Notes:

• I use jQuery event handlers only above and recommend you do not mix inline event handlers with jQuery. This avoid separating the event registration from the event handler and enables the extra event features jQuery provide.
• Using jQuery handlers lets you chain them too:

e.g.

$('.selecttag').on('focus', function(){
   $(this).data("value", $(this).val());
}).on('change', function(){
   var orig = $(this).data("value");
   var newVal = $(this).val();
   // Save the newer value 
   $(this).data("value", $(this).val());
   // Do something with both values!
});

The focus is actually redundant after the first time, so you can just do it once, like this:

$('.selecttag').one('focus', function(){
   $(this).data("value", $(this).val());
}).on('change', function(){
   var orig = $(this).data("value");
   var newVal = $(this).val();
   // Save the newer value 
   $(this).data("value", $(this).val());
   // Do something with both values!
});

Javascript/Jquery method to get previous selected value of a dropdown on change event

first option try this js code, but when u will change first time then there will be no previous selected value.

 var previous;

    function saveToDatabase(editableObj,column,id) {
       alert(previous); //print previous value
       var $selected = $(this).find(':selected');   
       previous= $selected.text();
    }

second option change this line

<select id = "selectedUnit" class="form-control" onchange="saveToDatabase(this.value,'Unit','<?php echo $ingredientArray[$i][0]; ?>')">

to this

<select id = "selectedUnit" class="form-control" onclick="saveToDatabase(this.value,'Unit','<?php echo $ingredientArray[$i][0]; ?>')">

and js for this will be

function saveToDatabase(editableObj,column,id) {
       var $selected = $(this).find(':selected');   
       previous= $selected.text();
       alert(previous);
    }

---

Related Topics