jQuery .find() inputs of multiple types

Question

I'm using the following jQuery to clone a set of input fields (1 Select field, 2 Text fields and 1 Number field)

$("#add_button").click(function(e) {
    e.preventDefault();
    $(".form-row :first").clone().insertAfter(".form-row :last").find("input[type='text']").val("");
});

Is there any way I can extend this so the cloned number fields don't also contain the values.

I've tried

$("#add_button").click(function(e) {
    e.preventDefault();
    $(".form-row :first").clone().insertAfter(".form-row :last").find("input[type='text|number']").val("");
});

Which doesn't work.

Tushar · Accepted Answer · 2016-01-04 14:46:32Z

6

The selector in .find("input[type='text|number']") is incorrect. To select multiple elements, separate the selectors by comma.

.find("input[type='text'], input[type='number']")

See Multiple Selectors

To set empty string as value to all the input elements, use element selector.

.find('input').val('')

edited Jan 4, 2016 at 14:46

answered Jan 4, 2016 at 14:32

Tushar

87.4k21 gold badges164 silver badges182 bronze badges

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

1 Comment

Luke Over a year ago

Thanks, I guessed the | was an invalid seperator, just didn't occur to me to use two selectors with a , seperator

Irvin Dominin · Accepted Answer · 2016-01-04 14:34:05Z

0

You must use a multiple element selector using , to separate each selector; like:

$("#add_button").click(function(e) {
    e.preventDefault();
    $(".form-row :first").clone().insertAfter(".form-row :last").find("input[type='text'], input[type='number']").val("");
});

answered Jan 4, 2016 at 14:34

Irvin Dominin

31k9 gold badges83 silver badges114 bronze badges

Collectives™ on Stack Overflow

jQuery .find() inputs of multiple types

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related