0

I have 10 input type(text) each have one unique id in a form I have set them as display none by default .Each input type is shown one buy one after clicking a common button

$(button).click( function(){

var id =this.id;

$('#'+id).show();


});

User may select any number of fields from 1-10. When form is submitted i want values of only those field which are shown . I am using ajax to send this data . I tried use queryselectorAll using class name but it is giving me all 10 values ( empty values for hidden input).

How do i get only shown input field values

Ranjeet Thorat
  • 162
  • 8
  • Also, [here](https://stackoverflow.com/questions/16782925/using-jquery-how-do-you-find-only-visible-elements-and-leave-hidden-elements-al/16782950) – devlin carnate Sep 02 '20 at 19:53

1 Answers1

0

jQuery has a :visible psuedoclass that you can use:

const $visible_inputs = $("form#form_id input:visible")
$visible_inputs.each( (index, element) => {
    console.log( $(this).val() );
});
Quentin
  • 914,110
  • 126
  • 1,211
  • 1,335