Primero comentarte, que el metodo para encontrar un elemento por id es getElementById()
. Aunque es más recomendable utilizar querySelector()
.
La solución a tu fallo:
<a class="step_block" onclick="activar()" href="" target="_blank" rel="nofollow noreferer">Boton1
</a>
<script language="javascript">
function activar(){
document.getElementById('buttone').disabled = false;
}
</script>
<form action="<?php echo $result ?>">
<button id="buttone" disabled="true" style="background-color:#26a69a;" target="_blank" class="btn waves-effect waves-light" type="submit" name="action">Proceed to target site</button>
</form>
Una manera de implementar que sean 2 o el numero de botones que quieras:
<a class="step_block" href="javascript: void(0)" target="_blank" rel="nofollow noreferer" data-clickado="false">Boton1
</a>
<a class="step_block" href="javascript: void(0)" target="_blank" rel="nofollow noreferer" data-clickado="false">Boton2
</a>
<form action="<?php echo $result ?>">
<button id="buttone" disabled="true" style="background-color:#26a69a;" target="_blank" class="btn waves-effect waves-light" type="submit" name="action">Proceed to target site</button>
</form>
<script language="javascript">
window.addEventListener('load', () => {
// Cuando la pagina termine de cargar, añadimos los eventos a los botones.
document.querySelectorAll('a[data-clickado]').forEach(el => {
el.addEventListener('click', activar);
});
});
function activar(e){
let salir = false;
e.targetcurrentTarget.dataset.clickado = true; // Guardamos el data para saber que el boton ha sido activado
document.querySelectorAll('a[data-clickado]').forEach(el => {
if (!salir && el.dataset.clickado === 'false') {
salir = true; // En caso en que falte un boton por activar avisamos a la variable
}
});
if (!salir) document.querySelector('#buttone').disabled = false; //activamos el boton si esta todo bien
}
</script>