1

Tengo un formulario que esta formado por fieldsets donde hay inputs de text etc, mi pregunta es como puedo saber en que fieldset estoy y así poder guardar la información de los inputs del fieldset actual. Todo esto desde mi onload=page() de mi body.

<Form>
        <fieldset id="field1">
            ...
            <input type="button" name="password" class="next btn btn-info" value="Next" onclick="next()" />
                   
        </fieldset>
        
        <fieldset id="field2">
            ...
            <input type="button" name="previous" class="previous btn btn-default" value="Previous" />
            <input type="button" name="next" class="next btn btn-info" value="Next" />
        </fieldset>
        
        <fieldset id="field3">
            ...
            <input type="button" name="previous" class="previous btn btn-default" value="Previous" />
            <input type="button" name="next" class="next btn btn-info" value="Next" />
        </fieldset>
        
</Form>
Function page()
{
 ..
}

1 respuesta 1

2

Puedes usar el atributo nodeName para obtener el tipo de un determinado elemento (contiene el nombre del tipo, en MAYÚSCULAS). Combinado con parentNode (para obtener el nodo padre), permite obtener lo que buscas.

Con eso, ya solo es cuestión de engancharnos donde necesitemos:

document.addEventListener( "click", function( e ) {    
    var item = e.target.parentNode;

    if( item.nodeName && ( item.nodeName == 'FIELDSET' ) ) {
        document.getElementById( 'ITEM' ).innerHTML = item.id;
    }
} );
<Form>
        <p id="ITEM"> --- </p>
        <fieldset id="field1">
            <input type="button" name="password" class="next btn btn-info" value="Next"/>
        </fieldset>
        
        <fieldset id="field2">
            <input type="button" name="previous" class="previous btn btn-default" value="Previous" />
            <input type="button" name="next" class="next btn btn-info" value="Next"/>
        </fieldset>
        
        <fieldset id="field3">
            <input type="button" name="previous" class="previous btn btn-default" value="Previous"/>
            <input type="button" name="next" class="next btn btn-info" value="Next"/>
        </fieldset>
</Form>

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.