CODEWITHSUNDEEP
javascriptjquery
Mariton
Mariton

Reputation: 621

How do you replace a specific value of an input field using jQuery?

I have the following input fields in a form. I would like remove undefined and replace it with a blank space "". I can't seem to get it to work. I only would like to remove "undefined" not original value.

<input type="hidden" name="address1" id="address1" value="Some address undefined" class="address1">

<input type="hidden" name="address2" id="address2" value="Another address undefined" class="address1">

I would only like to remove undefined. So far I've tried:

var str = $('input').value().replace(/undefined/g, 'ada');
$('input').value(str);

and 

$('input:contains("undefined")').each(function(){ 
     $(this).html($(this).html().split("undefined").join(""));
});

Upvotes: 2

Views: 4436

Answers (5)

Barmar
Barmar

Reputation: 781096

Use .val(), not .value(). You can give it a function as the argument. It will call this function with the old value as the argument, and the return value will be used as the new value (so you don't need to use .each() as in the other answers).

$("#click").click(function() {
  $("input").val(function(i, oldvalue) {
    return oldvalue.replace(/undefined/g, '');
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" name="address1" id="address1" value="Some address undefined" class="address1">

<input type="text" name="address2" id="address2" value="Another address undefined" class="address1">
<br>
<button id="click">Click to change</button>

Upvotes: 1

Carl Edwards
Carl Edwards

Reputation: 14434

You're using value(), which doesn't exist in the jQuery API. Use val() instead. On top of this you should iterate through each input via, each() and target the individual input of the current iteration using this.

$('input').each(function() {
  var str = $(this).val().replace(/undefined/g, 'ada');

  $(this).val(str);

  console.log(
    $(this).val()
  );
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="hidden" name="address1" id="address1" value="Some address undefined" class="address1" />

<input type="hidden" name="address2" id="address2" value="Another address undefined" class="address1" />

Upvotes: 1

Mamun
Mamun

Reputation: 68943

Use $('input').val() not $('input').value() with jQuery's each().

$('input').each(function(i, el){
  var str = $(el).val().replace(/undefined/g, '');
  console.log(str);
  $('input').val(str);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="hidden" name="address1" id="address1" value="Some address undefined" class="address1">

<input type="hidden" name="address2" id="address2" value="Another address undefined" class="address1">

Upvotes: 1

Kamal
Kamal

Reputation: 11

Just use

$('input').val("");

instead of 

var str = $('input').val().replace(/undefined/g, 'ada');
$('input').val(str);

Upvotes: 0

Tareq
Tareq

Reputation: 5363

You need to loop through each one of them using each.

$('input').each(function(){
  $this = $(this);
  $this.val($this.val().replace(/undefined/g, ''))
  console.log('new value is : ', $this.val());
}); 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="hidden" name="address1" id="address1" value="Some address undefined" class="address1">
<input type="hidden" name="address2" id="address2" value="Another address undefined" class="address1">

Upvotes: 0

Related Questions