Jquery add class in a class function using "this" as reference -


i'm trying use class reference addclass removeclass jquery (this). need universal reference class i'm adding dynamic elements page , need elements use function.

when reference element id works great. when reference element class can't seem modify class or input's value.

html

<input id="part"  size="15" type="text" class="part" name="part" value=""/> 

jquery (response okay; addclass, removeclass, this.val(data), not okay)

$(document).on('blur', '.part', function(){     var oldnumber = $(this).val().touppercase();     $.post("part-interchange.php",{ part:$(this).val() } ,function(data) {     //no data add class red remove green         if (data=='no') {                 $(this).removeclass('shadechange');                 $(this).removeclass('shadegood');                 $(this).addclass('shadebad');         } else if (data=='yes') {         $(this).removeclass('shadechange');                 $(this).removeclass('shadebad');                 $(this).addclass('shadegood');          } else if (data!='yes') {                 $(this).removeclass('shadebad');                 $(this).removeclass('shadegood');                 $(this).addclass('shadechange');                 $(this).val(data);            }      }); });  

however if reference using html id jquery works great

working jquery

$(document).ready(function() {         $("#part").blur(function() {             var oldnumber = $("#part").val().touppercase();             $.post("part-interchange.php",{ part:$("#part").val() } ,function(data) {                 //no data add class red remove green                 if (data=='no') {                     $("#part").removeclass('shadechange');                     $("#part").removeclass('shadegood');                     $("#part").addclass('shadebad');                     }                 // else if part add green remove red                  else if (data=='yes') {                     $("#part").removeclass('shadechange');                     $("#part").removeclass('shadebad');                     $("#part").addclass('shadegood');                  }                  else if(data!='yes') {                      $("#part").removeclass('shadebad');                      $("#part").removeclass('shadegood');                      $("#part").addclass('shadechange');                      $("#part").val(data);                  }                      });                 });         }); 

css

.shadegood{background-color:#d9f2e6;font-weight:700;color:#390} .shadebad{background-color:#f7e6e9;font-weight:700;color:red} .shadechange{background-color:#c7d9fc;font-weight:700;color:#0028f0} 

define var thisit = $(this) before $.post() , use thisit instead of $(this) code should

$(document).on('blur', '.part', function(){     var thisit = $(this);     var oldnumber = thisit.val().touppercase();     $.post("part-interchange.php",{ part: thisit.val() } ,function(data) {     //no data add class red remove green         if (data=='no') {                 thisit.removeclass('shadechange');                 thisit.removeclass('shadegood');                 thisit.addclass('shadebad');         } else if (data=='yes') {                 thisit.removeclass('shadechange');                 thisit.removeclass('shadebad');                 thisit.addclass('shadegood');          } else if (data!='yes') {                 thisit.removeclass('shadebad');                 thisit.removeclass('shadegood');                 thisit.addclass('shadechange');                 thisit.val(data);            }      }); });  

Comments

Popular posts from this blog

Hatching array of circles in AutoCAD using c# -

ios - UITEXTFIELD InputView Uipicker not working in swift -

Python Pig Latin Translator -