Visualizzazione dei risultati da 1 a 2 su 2
  1. #1
    Utente di HTML.it
    Registrato dal
    Sep 2010
    Messaggi
    217

    Campo diventa "enabled" se campi precedenti riempiti

    All'interno di un form: è possibile modificare l'attributo "disabled" (far sì che diventi "enabled") di un fieldset in tempo reale (senza ricaricare la pagina), in base all'avvenuta compilazione di campi precedenti?

    Campi che devono essere compilati per attivare il fieldset:
    codice HTML:
    <input type="text" id="id1_required" value="" name="id1">
    <input type="text" id="id2_required" value="" name="id2">
    <input type="text" id="id3_required" value="" name="id3">

    Il fieldset:
    codice HTML:
    <fieldset disabled='disabled'> [...] </fieldset>
    Grazie!
    Ultima modifica di Tom1884; 16-09-2016 a 10:24

  2. #2
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,726
    Sì, è possibile e si può fare in svariati modi.

    Qui uno tra tanti:
    codice:
    <!DOCTYPE HTML>
    <html>
      <head>
        <title>Esempio</title>
        <meta charset="utf-8">
      </head>
      <body>
            
            <input type="text" id="id1_required" value="" name="id1">
            <input type="text" id="id2_required" value="" name="id2">
            <input type="text" id="id3_required" value="" name="id3">
            
            <fieldset id="tuofieldset" disabled='disabled'> <input><input><input>... </fieldset>
            
        <script type="text/javascript">
                var required = document.querySelectorAll("#id1_required, #id2_required, #id3_required");
                required[0].onchange = required[1].onchange = required[2].onchange = attivaFieldset;
                function attivaFieldset(){
                    document.getElementById("tuofieldset").disabled = (required[0].value == "" || required[1].value == "" || required[2].value == "" );
                }
                attivaFieldset();
        </script>        
            
      </body>
    </html>
    Installa Forum HTML.it Toolset per una fruizione ottimale del Forum

Tag per questa discussione

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2024 vBulletin Solutions, Inc. All rights reserved.