2

Actualmente quisiera saber como puedo tomar el valor de un selecta ya sea numerico o cadena a travez de su clase, ya lo eh conseguido pero es por medio de su id, no tienen nada de malo con cualquiera es posible realizar la operacion, solo que primordialmente lo quise hacer con su clase y el valor lo puse una alerta, pero me salia en blanco la sintaxis que utilizaba era la siguiente:

alert($(".textLBL").val());

Quisiera saber si para aquirir el valor de un select mediante su clase es de forma diferente a la que se usa por medio de su id. la sintaxis que use con el id es la siguiente.

 alert($("#chkDireccion1").val());

tambien verifique si era un error de dedo al escribir la clase, pero todo estaba correcto. alguien sabe a que se pueda deber.

Lo que quiero es el value no su cadena de texto.

2
  • Tienes varios select con la misma clase en tu página, ¿verdad?
    – Alvaro Montoro
    el 27 ene. 2017 a las 16:21
  • Un id tiene mayor valor que una clase y por la sencilla razón de que un 'id' tiene que ser único. Siguiendo esta lógica, al utilizar clases estas pueden estar en distintos elementos llámese div, parrafo, select, botón, etc. Entonces al utilizarlos y tener mas de un elemento con la misma clase el navegador toma el primer valor que tiene esa clase, es decir que si tienes dos select y eliges pe. el segundo, toma el valor del primero.
    – cignius
    el 27 ene. 2017 a las 16:26

3 respuestas 3

1

El problema no tiene que ver con como seleccionas el select, y es más sobre que estas seleccionando realmente. Como algunos mencionan los ID deberían ser únicos, y por lo mismo es lo más adecuado usarlos. Mas si la clase que tienes asignada a tu select también es única no tiene ningún problema que selecciones el elemento por medio de esta.

El problema viene cuando varios elementos tienen la misma clase (ya que estas estas como lo dice su nombre designan una clase/tipo y es correcto usarlas más de una vez en un mismo documento), y cuando los selecciones con jQuery tendrás tantos elementos como elementos tengan asignada la clase por la que estas seleccionando. Y si llamas al método .val() este te retornara el valor del primero de los elementos seleccionados, que no necesariamente puede ser el que tu deseas.

Como solución se me ocurren dos cosas:

  • Lo más recomendado es que lo selecciones por su ID.
  • Si necesitas hacerlo por su clase, y varios select tienen esa clase, puedes acceder a uno concreto anexando el selector :eq(indice), donde indice es la posición del elemento que te interesa, y el primero tiene el indice 0.

Por ejemplo:

var $el = $('.i-am-select:eq(2)');
alert($el.val());
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<select class="i-am-select">
    <option>one</option>
</select>

<select class="i-am-select">
    <option>two</option>
</select>

<select class="i-am-select">
    <option>three</option>
</select>

Si cambias el indice en el selector :eq() veras como cambia el select seleccionado.

Suerte y Saludos!

1

En jQuery no debería haber ningún problema a la hora de leer el valor usando como selector la clase o el ID. El problema lo puedes encontrar si tienes varios select con la misma clase.

  • Cuando seleccionas por ID, ese ID es único (o debería serlo) y te devolverá el valor de ese select en particular.
  • Cuando seleccionas por clase, esa clase puede no ser única, en cuyo caso se devolverá una lista con todos los elementos que tengan esa clase; Entonces al hacer el val() sólo te devuelve el valor del primero (que seguramente no está seleccionado y por eso sólo ves una cadena vacía en el alert) lo cual puede llevar a confusiones si lo que querías leer es el valor del segundo/tercero/etc.
1

Quiero dejarte un ejemplo como te puede ser útil usando el $(this)1 selector, cuando tienes varios select con la misma clase (aunque tampoco es necesario que tengan una clase asignada) y quieras sacar el valor (value) de cada uno:

$(function(){
  
  $('.select').on('change', function() {
    
    console.log( $(this).prop('value') );
  });
});
<script src="https://code.jquery.com/jquery-3.0.0.js"></script>  
<select class="select">
  <option value="01">Selecciona</option>
  <option value="01_valor">select 1</option>
</select>  
<select class="select">
  <option value="02">Selecciona</option>
  <option value="02_valor">select 2</option>
</select>  
<select class="select">
  <option value="03">Selecciona</option>
  <option value="03_valor">select 3</option>
</select>
  

1$(this) - Se refiere o representa el objeto seleccionado actualmente en un bucle o evento.

1

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.