5

Tengo un caso donde se calcula el puntaje mayor y se obtiene el equipo ganador.
1 - usuario ingresa los equipos.
2 - usuario ingresa puntuación.
El resultado es obtener la puntuación mayor y el equipo ganador.

Hasta el momento estoy obteniendo el resultado mayor, pero tengo problemas en obtener el equipo ganador del input.

Este es mi HTML.

function Calcular() {
  var p1 = document.getElementById('p1').value;
  p1 = parseInt(p1);
  var p2 = document.getElementById('p2').value;
  p2 = parseInt(p2);
  var p3 = document.getElementById('p3').value;
  p3 = parseInt(p3);

  var p = [p1, p2, p3];

  var mayor = null;
  var ganador = null;

  for (var i = 0; i < p.length; i++) {
    if (mayor < p[i]) {
      mayor = p[i]
    }
  }

  document.getElementById('resultado').innerHTML = mayor;
}
<table>
  <tr>
    <td><label>Equipos:</label></td>
    <td><input type="text" name="txtequipo1" id="equipo1"></td>
    <td><label>Puntaje :</label></td>
    <td>
      <select name="cbotipo" id="p1">
        <option>10</option>
        <option>20</option>
        <option>30</option>
      </select>
    </td>
  </tr>
  <tr>
    <td><label>Equipos:</label></td>
    <td><input type="text" name="txtequipo2" id="equipo2"></td>
    <td><label>Puntaje :</label></td>
    <td>
      <select name="cbotipo" id="p2">
        <option>10</option>
        <option>20</option>
        <option>30</option>
      </select>
    </td>
  </tr>
  <tr>
    <td><label>Equipos:</label></td>
    <td><input type="text" name="txtequipo3" id="equipo3"></td>
    <td><label>Puntaje :</label></td>
    <td>
      <select name="cbotipo" id="p3">
        <option>10</option>
        <option>20</option>
        <option>30</option>
      </select>
    </td>
  </tr>
  <tr>
    <td><label>Resultado</label></td>
    <td><label id="resultado"></label></td>
  </tr>
</table>
<div class="cont-controles">
  <input type="submit" name="btnBoton" value="calcular Puntaje " class="btn-buscar" onclick="Calcular()" />
</div>

1 respuesta 1

5

Puedes hacerlo así:

function Calcular() {
  // seleccionamos todos los elementos que select que empiezen con el id p "p1" "p2" etc.
  var p = document.querySelectorAll('select[id^="p"]');
  var mayor = 0;
  var ganador = 0;

  for (var i = 0; i < p.length; i++) {
    if (mayor < p[i].value) {
      mayor = p[i].value;
      // selecctionamos al padre del select "td" y luego a su padre "tr"
      // a partir de ahi buscamos un input y optenemos su valor          
      ganador = p[i].parentElement.parentElement.querySelector("input").value;
    }
  }
  document.getElementById('resultado').innerHTML = "ganador es " + ganador + " con: " + mayor;
}
<table>
  <tr>
    <td><label>Equipos:</label></td>
    <td><input type="text" name="txtequipo1" id="equipo1"></td>
    <td><label>Puntaje :</label></td>
    <td>
      <select name="cbotipo" id="p1">
        <option>10</option>
        <option>20</option>
        <option>30</option>
      </select>
    </td>
  </tr>
  <tr>
    <td><label>Equipos:</label></td>
    <td><input type="text" name="txtequipo2" id="equipo2"></td>
    <td><label>Puntaje :</label></td>
    <td>
      <select name="cbotipo" id="p2">
        <option>10</option>
        <option>20</option>
        <option>30</option>
      </select>
    </td>
  </tr>
  <tr>
    <td><label>Equipos:</label></td>
    <td><input type="text" name="txtequipo3" id="equipo3"></td>
    <td><label>Puntaje :</label></td>
    <td>
      <select name="cbotipo" id="p3">
        <option>10</option>
        <option>20</option>
        <option>30</option>
      </select>
    </td>
  </tr>
  <tr>
    <td><label>Resultado</label></td>
    <td><label id="resultado"></label></td>
  </tr>
</table>
<div class="cont-controles">
  <input type="submit" name="btnBoton" value="calcular Puntaje " class="btn-buscar" onclick="Calcular()" />
</div>

0

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.