Tengo una duda; de cómo mostrar dinámicamente en el DOM los elementos seleccionados por un input type radio.
Actualmente como tengo el código funciona así: selecciono un elemento de tipo radio y luego presiono un botón de tipo submit y allí me muestra la información.
Yo quisiera que se muestre apenas seleccione el type radio
sin necesidad de utilizar el submit
.
Fragmento JavaScript:
$("#confirmar").click(function () {
//Creo variables para asegurarme que no me arroje NaN
let checkRadio = parseInt($("input:radio:checked").val()) || 0;
let nuSections = parseInt($("#nuSecciones").val()) || 1;
let priceSections = parseInt(precioSecciones) || 0;
let switchCheck = parseInt($("#switchMantenimiento:checked").val()) || 0;
// Compruebo si se selecciono algún servicio
if (!checkRadio) {
nuSections = 0;
alert("Por favor, seleccione un servicio");
console.log("no se seleccionó ningún servicio.");
} else {
console.log("Seleccionado");
}
let total = 0;
total = checkRadio + nuSections * priceSections + switchCheck;
totalWeb.innerText = `$ ${total}`;
});
Fragmento HTML:
<tr id="porfolio">
<!-- HTML-->
<td>
<div class="form-check">
<input class="form-check-input input" type="radio" name="servicios" id="radios1" value="2300" />
<label class="form-check-label" for="radios1"> Portfolio </label>
</div>
</td>
<td>
$2300
</td>
</tr>
<tr id="eCommerce">
<td>
<div class="form-check">
<input
class="form-check-input input" type="radio" name="servicios" id="radios2" value="2500" />
<label class="form-check-label" for="radios2"> eCommerce </label>
</div>
</td>
<td>
$2500
</td>
</tr>