3

Mi pregunta es algo sencilla:

¿Es posible obtener un input por su id y su name?

Es decir, tengo dos inputs:

<input id="uno" name="a"/>

<input id="dos" name="a"/>

<input id="uno" name="b"/>

<input id="dos" name="b"/>

Pero quiero enviar un value al segundo input, solo a ese.

Yo se que un input debe tener un id, pero resulta que tengo un generador de formularios y puede suceder que el cliente en algún momento se le olvide cambiar el id del input y este se genera automáticamente, ocasionando que pueda repetirse.

6
  • Buen día, qué haz intentado hacer? el 13 ene. a las 13:51
  • Tienes que añadir a tu pregunta lo que ha realizado hasta ahora a partir de allí te ayudaran, comparte tu html y js.
    – JoseMgz_Ux
    el 13 ene. a las 13:52
  • al momento lo que he intentado es digamos, que obviamente es de formularios diferentes, pero digamos que en el formulario 5 se me repite el id, se envia el value a id del input anterior borrandome el dato anterior el 13 ene. a las 13:55
  • 5
    El id debe ser único si o si, siempre, El id es un identificador del cliente, es decir se usa en el navegador y principalmente en javascript, aunque puedes obtener un elemento de otras maneras sin ocupar el id. El name se usa del lado del servidor, cuando se envían los datos en un formulario, puede repetirse si se usan en forma de array, ej: nombre[] con el sufijo [] para algunos servidores, en otros es necesario colocar el índice nombre[1]
    – Yussef
    el 13 ene. a las 13:58
  • como dice @Yussef tienes un error de sintaxy en tu html ... no pueden existir elementos con id duplicados . el 13 ene. a las 19:01

4 respuestas 4

1

Pues si estas usando JQuery como dice tu etiqueta es sencillo utilizando los selectores con los que cuenta $(""), solo debes usar lo siguiente:

Para obtener el input por el id:

const input = $('#id');

Para obtenerlo por la clase:

const input = $('.class');

Para obtenerlo mediante un atributo:

const input = $('input[attribute="value"]');

En tu caso para obtenerlo por dos atributos (id, nombre):

const input = $('input[id="idInput"][name="nombreInput"]');

Puedes ver más información sobre selectores para Jquery en https://api.jquery.com/category/selectors

Te dejo un ejemplo funcional:

function mostrarValor() {
  const inputUno = $('#uno');
  console.log('Input uno:', inputUno.val());

  const inputDos = $('input[id="dos"][name="a"]');
  console.log('Input dos:', inputDos.val());
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<input id="uno" name="a" /><br>
<input id="dos" name="a" /><br>

<button onclick='mostrarValor()'>Mostrar valores</button>

Pero como bien te dicen en los comentarios el id debe ser único, es muy mala práctica que pase lo que mencionas (que el mismo id pueda existir en varios componentes incluso cuando es generado automáticamente).

1
1

Con el método querySelector() puedes obtener múltiples atributos, en este caso obtendremos al id y al name del segundo input. De ésta forma tendremos únicamente al segundo input ya que es el único quien lleva ese id junto con ese name, sería de esta forma:

document.querySelector('input[id="dos"][name="a"]').value = "valor";
<input id="uno" name="a"/><br>
<input id="dos" name="a"/><br>
<input id="uno" name="b"/><br>
<input id="dos" name="b"/><br>

También, recuerda que Los id son los identificadores de cada uno de los elementos, éstos siempre van a ser únicos y no se deben repetir en más de un elemento, para ello podrías trabajar con clases, véase más aquí.

3
  • este metodo tambien me funciono, muchas gracias el 16 ene. a las 15:57
  • Claro, es una solución que motiva la mala práctica (id duplicado). el 17 ene. a las 6:43
  • @mauriCioContreras pero se lo estoy diciendo justo debajo en mi respuesta... el 17 ene. a las 11:42
0

puede hacerlo asi:

//seleccionamos el input con name b y id dos
let input1 = document.querySelector("input[name='b']#dos");
console.log(input1);
// a lo inverso
let input2 = document.querySelector("input#dos[name='a']");
console.log(input2);
div #dos {
 border-color:blue;
 color:blue;
}

div#dos {
 border-color:red;
 color:red;
}
<input id="uno" name="a"/> <br>
<input id="dos" name="a"/> <br>
<input id="uno" name="b"/> <br>
<input id="dos" name="b"/> <br>

<div id="dos">padre <span id="dos"> hijo</span></div>
<div id="dos">padre <span id="dos"> hijo</span></div>

NOTA

para jquery solo es remplazar document.querySelector por $

si se coloca el selector todo junto sin espacio hace referencia al elemento actual ejemplo: rojo

si se agrega un espacio hace referencia los hijos ejemplo: azul

se ilustro con un css para mayor compresion

-2

puedes probar con

var valor = document.getElementById("id del input").value

asío recogeras el valor del input que tenga el mismo id que el que tu le escribes

si únicamente quieres el input para más adelante conseguir el valor o hacer otra cosa haces simplemente esta línea

document.getElementById("id del input")
1
  • esto no responde lo que el OP está solicitando. verifica nuevamente la duda que presenta el usuario. el 13 ene. a las 18:15

Tu Respuesta

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

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