How to get the name of an element [1], element [2] with jquery

Question

How to get the name of an element [1], element [2] with jquery

Navigation

#1 by (1 votes)
#2 by (1 votes)

2

I have selectors who have a name:

<select name="selector[]" id="selector">
   <option value="1">Valor 1</option>
   <option value="2">Valor 2</option>
</select>

<select name="selector[]" id="selector">
   <option value="1">Valor 1</option>
   <option value="2">Valor 2</option>
</select>

These selectors can be 1, 10 or 20 depending on the circumstances, and I would like to know which selector is clicked by the user with Jquery, the selector [1], selector [2] , etc.

When it's only 1 selector, I can perform actions on the con jquery easily like this:

$('#selector').on('change', function(e){
     e.preventDefault();
     // acciones
});

But when the selector is not the first one, this does not work anymore, so I need to know which selector clicked on.

Greetings and Thanks!

jquery html php select selectores

asked by user3123766 19.03.2018 в 21:07

source

2 answers

Send SII model to hacienda using cURL Error getting user's location - Android GPS

score 1 · Answer 1

You can use the function of the keyword this since 2 elements can not contain the same ID, so you can make a selection by the attribute name in this case that I think your data will go to a cycle in php;

  $(document).ready(function(){
      $("[name='selector[]'").change( function(){
            console.log($(this).val());
    });
  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
   <select name="selector[]" id="selector">
   <option value="1">Valor 1</option>
   <option value="2">Valor 2</option>
</select>

<select name="selector[]" id="selector">
   <option value="1">Valor 1</option>
   <option value="2">Valor 2</option>
</select>

In general, the value of this is determined by how the function is called. It can not be established by a runtime assignment, and this can be different each time the function is called.

Documentation: link

score 1 · Answer 2

As a general rule, two or more elements should never have the same id .

When specified in HTML elements, the value of the id attribute   must be unique among all IDs in the element tree and must   contain at least one character The value must not contain any   ASCII blank space.

▸ Source: The id attribute in the HTML specification

Consequently, you should give each selector a different id.

Then you can make a function that listens to the changes of the elements select and by this tells you which was selected.

You can combine this with any item property to get the data. For example: this.name, this.id, this.value... .

$('select').on('change', function(e) {
  e.preventDefault();
  /*Valor de la opción seleccionada*/
  console.log("Valor: "+this.value);

  /*Nombre del selector seleccionado*/
  console.log("Nombre: "+this.name);

  /*Id del selector seleccionado*/
  console.log("Id: "+this.id);

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="selector[]" id="selector1">
   <option value="1">Valor 1</option>
   <option value="2">Valor 2</option>
</select>
<hr />
<select name="selector[]" id="selector2">
   <option value="1">Valor 1</option>
   <option value="2">Valor 2</option>
   <option value="3">Valor 3</option>


</select>