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

Question

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

These hidden inputs are obviously used in a form and not displayed (ie: hidden") - so leave the undefined in and deal with it at the destination of the form (ie: in the php page that the form passes its data to- faster than trying to modify the value client side. — gavgrif
– gavgrif, Commented Dec 29, 2017 at 1:15

Mamun · Accepted Answer · 2017-12-29 01:19:34Z

1

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">

edited Dec 29, 2017 at 1:19

answered Dec 29, 2017 at 1:13

Mamun

69k9 gold badges51 silver badges62 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Carl Edwards · Accepted Answer · 2017-12-29 01:30:57Z

1

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

edited Dec 29, 2017 at 1:30

answered Dec 29, 2017 at 1:12

Carl Edwards

14.6k12 gold badges69 silver badges131 bronze badges

3 Comments

Mariton Over a year ago

Thanks for this. The thing about this is it's replacing the current value. I only would like to replace 'undefined" Not the entire value

Carl Edwards Over a year ago

@Mariton Revised my answer.

Mariton Over a year ago

Thank you all of these answers were helpful!

Barmar · Accepted Answer · 2017-12-29 02:47:59Z

1

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>

answered Dec 29, 2017 at 2:47

Barmar

789k57 gold badges554 silver badges669 bronze badges

Comments

Tareq · Accepted Answer · 2017-12-29 01:18:48Z

0

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">

answered Dec 29, 2017 at 1:18

Tareq

5,3732 gold badges18 silver badges18 bronze badges

Comments

jwpfox · Accepted Answer · 2017-12-29 01:19:10Z

0

Just use

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

instead of

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

edited Dec 29, 2017 at 1:19

jwpfox

5,27011 gold badges49 silver badges42 bronze badges

answered Dec 29, 2017 at 1:17

Kamal

113 bronze badges

Collectives™ on Stack Overflow

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

5 Answers 5

Comments

3 Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

3 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest