CODEWITHSUNDEEP
javascriptjquerydropdown
jackhammer013
jackhammer013

Reputation: 2297

Get previous value of dropdown after onchange event jQuery

How do I get the previous value of my AUTO-Generated dropdown menu after an onchange event? Example

<select class="form-control" name="Diabetes_UK_3147" id="Diabetes_UK_3147" onchange="return verifyUpdateResponseGross(this);">
  <option value="Yes">Yes</option>
  <option value="Possibly">Possibly</option>
  <option value="">N/A</option>
</select>

and I have this function

function verifyUpdateResponseGross(val)
{
  var updated_response = val.value;
  var colheader = val.name
  var before_gross = $('#new_gross').val(); 

  $.ajax({
  url: "qa/api/crm/getquestion", 
  type: 'GET',
  data: {'colheader':colheader},
  success: function(result){
    // var costperlead = result;
    // if(updated_response != "")
    // {
    //  var new_gross_amount = parseFloat(before_gross) + parseFloat(costperlead);
    //  $('#new_gross').val(new_gross_amount);
    // }
    // else
    // {
    //  var new_gross_amount = parseFloat(before_gross) - parseFloat(costperlead);
    //  $('#new_gross').val(new_gross_amount);
    // }
    // console.log(costperlead);
   }});
}

The reason I want to get the previous value is I need a checking that if the dropdown value is empty (N/A) then I need to perform some operation and if the value is not empty then I need perform another operation, But when the value gis not empty but the same from the previous value, then do nothing.

Those operation are those in comments. Thanks

UPDATE The id and name is autogenerated. That's why I have a

onchange="return verifyUpdateResponseGross(this);"

This will handle the change and do necessary operation.

This is it is autogenerated

enter image description here

Upvotes: 0

Views: 11103

Answers (4)

Inuter
Inuter

Reputation: 1

var $select = $("#my-select");

$select.data("prevVal", $select.val()).data("currVal", $select.val()).on("change", function () {
    var $this = $(this);
    $this.data("prevVal", $this.data("currVal")).data("currVal", $this.val());

    // do your staff here. Previous value is available in $this.data("prevVal")
});

Upvotes: 0

Shailendra Sharma
Shailendra Sharma

Reputation: 6992

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 */

Upvotes: 3

lshettyl
lshettyl

Reputation: 8181

Use data-* as below. Also, remove the inline event handler onchange="return verifyUpdateResponseGross(this);" and do it the unobtrusive way.

var $select = $("#Diabetes_UK_3147");
$select.data("previous-val", $select.val());

$select.on("change", function() {

    var current_value = $(this).val();

    if (current_value == "") {
        //Do stuff when empty   
    } else if ( current_value != $(this).data("previousVal") && current_value != "" ) {
        //Do stuff when not empty and current value != previous value
    }
});

Upvotes: 1

ojovirtual
ojovirtual

Reputation: 3362

Use data to store the data instead a global variable:

$("#Diabetes_UK_3147").on("focus",function(){  
     $(this).data('previous',$(this).val());
}

Then you can access previous value by $("#Diabetes_UK_3147").data('previous');

jQuery data

Upvotes: 2

Related Questions