[SOLUCIONADO] Cambiar modo de interacción interactivamente

[Pantaláimon]

Buenas.

Estaba haciendo una prueba con el parámetro evento del método addEventListener. Tengo el siguiente código HTML:

Código HTML:

<form method="get" action="" name="suma">
    <select name="eventType">
        <option value="submit">submit</option>
        <option value="input" >input</option>
    </select>
    <input type="text" name="num1" />
    +
    <input type="text" name="num2" />
    =
    <output name="result"></output>
    <input type="submit" value="resultado"/>
</form>
 

Tengo un campo select que según si está seleccionada la opción submit o input quiero que el formulario responda al evento submit o input, respectivamente. Aquí el código javascript:

Código Javascript:

window.addEventListener( "load", function(){
 
    var formSuma  = document.forms.suma;
    var eventType = formSuma.eventType.value;
    formSuma.eventType.addEventListener( "change", function(){
        console.log( formSuma.eventType.value );
    });
 
    formSuma.addEventListener( formSuma.eventType.value, function(){
        console.log( "eo" );
    });
});
 

Sin embargo, independientemente del valor de select el formulario siempre responde en caso de hacer un submit. Dejo también el ejemplo en jsfiddle: http://jsfiddle.net/ESdav/

¿Alguien sabría cuál es el problema? Gracias!

[Pantaláimon]

Vaya! que poco inspirado estaba ayer.

Por un lado, para producir algun cambio tras cambiar la selección el código de interés lo debería haber puesto dentro de:

Código Javascript:

formSuma.eventType.addEventListener( "change", function(){
...
});
 

Por otro lado, añadir un evento nuevo a un elemento no quita el anterior. Debería usar removeEventListener. Con todo ello así quedaría el código javascript:

Código Javascript:

function hola(){
    alert("hola");
}
 
window.addEventListener( "load", function(){
    
    /* exercici 1 */
    var formSuma  = document.forms.suma;
    var prev = formSuma.eventType.value;
    formSuma.addEventListener( prev, hola );
 
    formSuma.eventType.addEventListener( "change", function(){
        formSuma.removeEventListener( prev, hola );
        formSuma.addEventListener( formSuma.eventType.value, hola );
        prev = formSuma.eventType.value;
    });    
});
 

Dejo el tema como solucionado pero accepto cualquier consejo si se puede mejorar.

Un saludo!