Removing part of a form input's value with jQuery/JavaScript

Question

I have a hidden input on my page like so:

<input type="hidden" name="required" value="name,town,tel,email">

As people fill in it's associated form, certain other fields become required (i.e. State becomes required when choosing "USA" from a Country dropdown).

I have two functions, one named addToRequiredFields() and one named removeFromRequiredFields() which fire as USA is selected/de-selected, however the removal one doesn't seem to be working, and I can't figure out why.

function addToRequiredFields(string) {
    var required = $('input[name=required]').val();
    required += ',' + string;
    $('input[name=required]').val(required);
}

function removeFromRequiredFields(string) {
    var required = $('input[name=required]').val();
    required.replace(',' + string, '');
    $('input[name=required]').val(required);
}

The function is called at .on('change') of the Select dropdown.

did you try required = required.replace(',' + string, ''); instead of just required.replace(',' + string, ''); — Mohamed-Yousef
– Mohamed-Yousef, Commented Apr 26, 2017 at 8:24
Haha wow, it was that simple! Thanks Mohamed. I don't suppose you could help me replace() every instance of said string, not just one, could you? — mpdc
– mpdc, Commented Apr 26, 2017 at 8:27
BTW: replace(',' + string, '') doesn't work if string is at the beginning — hindmost
– hindmost, Commented Apr 26, 2017 at 8:27
Just a sidenote, the logic of which fields are mandatory should be done on the server. What's to stop me from simply editing this field to make nothing mandatory and send you a bad form? — Artless
– Artless, Commented Apr 26, 2017 at 8:28

Ashraf · Accepted Answer · 2017-04-26 08:32:20Z

Though Its not a proper way to validate controls based on input value , I made a script for you .

function addToRequiredFields(string) {
    var required = $('input[name=required]').val();
    fieldsArray = required.split(",")
    fieldsArray.push(string)
    $('input[name=required]').val(fieldsArray.join());
}

function removeFromRequiredFields(string) {
    var required = $('input[name=required]').val();
    fieldsArray = required.split(",")
    fieldsArray = fieldsArray.filter(function(item) { 
    return item !== string
})
    $('input[name=required]').val(fieldsArray.join());
}

console.log($('input[name=required]').val())

addToRequiredFields("age")

console.log($('input[name=required]').val())

removeFromRequiredFields("name")

console.log($('input[name=required]').val())

removeFromRequiredFields("tel")

console.log($('input[name=required]').val())

addToRequiredFields("name")

console.log($('input[name=required]').val())

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
<input type="hidden" name="required" value="name,town,tel,email">
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>

</body>
</html>

Rohith K P · Accepted Answer · 2017-04-26 08:39:28Z

0

Use the below login inside yourremove function.removeFromRequiredFields

//var requiredArr = $('input[name=required]').attr('value');
    var requiredArr = "name,town,tel,email".split(',');
var rmvIndex = requiredArr.indexOf("tel")//"tel" is your string to be removed

var newArr = requiredArr.splice(rmvIndex, 1);

$('input').attr('value', newArr.join(','))// set value attribute after removing that string

answered Apr 26, 2017 at 8:39

Rohith K P

3,5831 gold badge24 silver badges28 bronze badges

Collectives™ on Stack Overflow

Removing part of a form input's value with jQuery/JavaScript

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related