Menu select + bottone

**jago** · 21-07-2006, 11:17

Ciao a tutti.. ho urgente bisogno e non sono troppo in grado con l'html..

Devo fare un menu select (a tendina) che mi permetta di scegliere tra diversi voci:

a1
a2
a3
....

con il click sul bottone si deve eseguire una function javascript diversa associata ad ogni bottone

funct1()
funct2()

Grazie in anticipo.. salvatemi x favore!!

Jago

**Psyko83** · 21-07-2006, 11:30

Allora per il menù a tendina, basta fare così:
<form id="form1" name="form1" method="post" action="">
<select name="select">
<option value="xxx">xxx</option>
<option value="yyy">yyy</option>
</select>
<input type="submit" name="Invia" value="Invia" />
<input type="submit" name="Aggiorna" value="Aggiorna" />
<input type="submit" name="Cancella" value="Cancella" />
</form>

Questo è tutto!!!
Poi ti fai un bel select case in php o asp e dentro ci metti le funzioni che vuoi tu!!

**nuky** · 21-07-2006, 11:31

Puoi farlo in molti modi, uno è quello di usare l'eval:

codice:

<html>
  <head>
    <script type="text/javascript">
      function f1 ()
        {
          alert("1");
        }
      function f2 ()
        {
          alert("2");
        }
      function f3 ()
        {
          alert("3");
        }
    </script>
  <head>
  <body>
    <select onchange="eval(this.value + '();')">
      <option value="f1">Funzione 1</option>
      <option value="f2">Funzione 2</option>
      <option value="f3">Funzione 3</option>
    </select>
  </body>
</html>

**nuky** · 21-07-2006, 11:34

Originariamente inviato da Psyko83
Allora per il menù a tendina, basta fare così:
<form id="form1" name="form1" method="post" action="">
<select name="select">
<option value="xxx">xxx</option>
<option value="yyy">yyy</option>
</select>
<input type="submit" name="Invia" value="Invia" />
<input type="submit" name="Aggiorna" value="Aggiorna" />
<input type="submit" name="Cancella" value="Cancella" />
</form>

Questo è tutto!!!
Poi ti fai un bel select case in php o asp e dentro ci metti le funzioni che vuoi tu!!

Credo voglia fare tutto lato client...

Anzi... senza credo:

Originariamente inviato da jago
deve eseguire una function javascript

**jago** · 21-07-2006, 11:39

Esattamente.. tutto da lato client..

Vorrei poter scegliere la funzione da eseguire tramite il menu a tendina (che ora so creare

)

Poi con il click sul bottone vorrei far eseguire la function associata a ciò che ho scelto nel menu a tendina

ES:

Definite
<script>
funct1()
funct2()
</script>

come faccio ad associarle alle singole voci del menu?

e soprattutto come faccio a far eseguire dal bottone ciò che ho indicato nel menu a tendina?

Cioè volendo fare un bottone solo mi verrebbe una cosa del genere in base a come l'ho pensata:

<input type="button" onclick=funct1() value="Inserisci">

grassie!

**pierofix** · 21-07-2006, 11:41

Le prime due cose che mi vengono in mente riguardo ai menu di questo tipo sono:

la struttura di markup del form deve essere accessibile;
devono funzionare anche in caso di javascript disabilitato, quindi conviene direttamente farlo funzionare lato server.

In generale farei una cosa del genere:

codice:

XHTML

<form action="indirizza.php">

   <fieldset>
      <legend>Naviga tra le sezioni</legend>

      


         <label for="sezioni">Scegli una sezione:</label>
         <select id="sezioni" name="sezioni">
            <option value="home">home</option>
            <option value="blog">blog</option>
            <option value="articoli">articoli</option>
            <option value="foto">foto</option>
            
         </select>
         <input type="submit" value="vai" />
      </p>
   </fieldset>

</form>


'indirizza.php'

<?php
   $url_base = 'http://www.miosito.it/';
   $sezione = $_GET['sezioni'];

   header('Location: ' . $url_base . $sezione);
?>

Se non ho scritto boiate dovrebbe andare.

**nuky** · 21-07-2006, 11:42

Ah, con il bottone, cambia poco rispetto a quanto ho scritto prima:

codice:

<html>
  <head>
    <script type="text/javascript">
      function f1 ()
        {
          alert("1");
        }
      function f2 ()
        {
          alert("2");
        }
      function f3 ()
        {
          alert("3");
        }
    </script>
  </head>
  <body>
    <select id="mSelect">
      <option value="f1">Funzione 1</option>
      <option value="f2">Funzione 2</option>
      <option value="f3">Funzione 3</option>
    </select>
    <input type="button" value="Esegui funzione" onclick="eval(document.getElementById('mSelect').value + '();')" />
  </body>
</html>

**pierofix** · 21-07-2006, 11:45

Originariamente inviato da jago
tutto da lato client

Stai attento, però.

Il menu di navigazione è una cosa essenziale in una collezione di documenti, e non puoi permetterti che una qualche barriera possa renderlo inutilizzabile.

Penso a quelle persone che navigano con dispositivi privi di motore javascript, ad esempio.

**jago** · 21-07-2006, 11:47

diciamo che l'ultimo commento non l'ho capito..

xò ho risolto tutto con l'ultimo pezzo di codice!!!
grandi... grazie mille!!!

Jago

**pierofix** · 21-07-2006, 11:54

Originariamente inviato da jago
diciamo che l'ultimo commento non l'ho capito..

Per accedere alle informazioni presenti sul web non esistono ovviamente solo Firefox, Opera o Internet Explorer.

Esistono dispositivi per persone con particolari disabilità, i cellulari, i box-informativi in stazioni e aeroporti e via dicendo. Insomma, non possiamo mai sapere chi e come accederà alle nostre informazioni.

Cosa succede se, ad esempio, io entro sul tuo sito con un browser che non supporta javascript? Il menu non funzionerebbe e io non potrei sportarmi all'interno del sito. Risultato: l'intero sito mi risulterebbe impossibile da consultare.

Non è una gran bella cosa.

Discussione: Menu select + bottone

Strumenti discussione

Ricerca discussione

Visualizza

Menu select + bottone

Permessi di invio