Aggiungere campo select ad un form già esistente.

[ubbicom]

Ciao al forum.

Vorrei sapere se in javascript è possibile aggiungere un campo ulteriore in un form predefinito in caso di necessità.

Mi spiego meglio:

il mio form è costituito da sei select dinamiche popolate da un db tramite un linguaggio lato server: ogni select contiene sei valori tra loro tutti diversi.

ma può capitare che tra i sei valori presenti e previsti in ciascuna delle select dinamiche non ci sia quello voluto; in questo caso tramite il linguaggio lato server aggiungo questa nuova voce alla tabella del db, il form si aggiorna e trovo l'ultima voce inserita all'interno delle sei select dinamiche, fin qui tutto è ok

sarebbe possibile anche aggiungere una settima select dinamica al form quando si decide di aggiungere la settima voce alla tabella del db popolata dalle sei voci già esistenti con in più la ultima voce inserita ?

grazie

[artorius]

Allora, il tuo discorso è un po' vago, ma se ti interessa aggiungere un elemento ad un form, la cosa è molto semplice:

function addSelectToForm(form_id, select_opts)
{
   /*in form_id c'è id del form, ed select_opts è un array con i value delle option da immettere nel select*/
   
   /*Creo l'elemento select*/
   var select = document.createElement("select");
   
   /*Itero sull'array per creare le options*/
   for(i = 0; i < select_opts.length; i++)
   {
      var opt = document.createElement("option");
      opt.value = select_opts[i];
      opt.appendChild(document.createTextNode(select_opts[i]));
      select.appendChild(opt);
   }
   
   document.getElementById(form_id).appendChild(select);
} 

In generale si fa così.

[ubbicom]

grazie, non ho capito il vago allora ti faccio un esempio:

sei select dinamiche tutte uguali di questo tipo:

<select size="1" name="select_n1">
  <option>Selezionare</option>
  <option value="AAA">AAA</option>
  <option value="BBB">BBB</option>
  <option value="CCC">CCC</option>
  <option value="DDD">DDD</option>
  <option value="EEE">EEE</option>
  <option value="FFF">FFF</option>
</select>

<select size="1" name="select_n2">
  ...
</select>

<select size="1" name="select_n3">
  ...
</select>

Facciamo il caso che a me serve inserire valore GGG che non è prevista nella select.

Nel form c'è un tasto Aggiungi che apre una popup dove inserisco valore GGG e lo salvo.

Il form si aggiorna e le select diventano:

<select size="1" name="select_n1">
  <option>Selezionare</option>
  <option value="AAA">AAA</option>
  <option value="BBB">BBB</option>
  <option value="CCC">CCC</option>
  <option value="DDD">DDD</option>
  <option value="EEE">EEE</option>
  <option value="FFF">FFF</option>
  <option value="GGG">GGG</option>

</select>

<select size="1" name="select_n2">
  ...
</select>

<select size="1" name="select_n3">
  ...
</select>

Quando si aggiorna il form si dovrebbe aggiungere una nuova select così:

<select size="1" name="select_n1">
  <option>Selezionare</option>
  <option value="AAA">AAA</option>
  <option value="BBB">BBB</option>
  <option value="CCC">CCC</option>
  <option value="DDD">DDD</option>
  <option value="EEE">EEE</option>
  <option value="FFF">FFF</option>
  <option value="GGG">GGG</option>

</select>

<select size="1" name="select_n2">
  ...
</select>

<select size="1" name="select_n3">
  ...
</select>

<select size="1" name="select_n7">
  ...
</select>

Mi segui?

[artorius]

si, mmm, è un po' complicato...

allora... ma non c'è una relazione diretta tra il value del'option che crei e la select che devi aggiungere? Lo dico perché potrebbe esserti più semplice da gestire.

[ubbicom]

Originariamente inviato da artorius
si, mmm, è un po' complicato...

allora... ma non c'è una relazione diretta tra il value del'option che crei e la select che devi aggiungere? Lo dico perché potrebbe esserti più semplice da gestire.

Potrebbe essere che il value dell'option che creo non è presente in nessuna della select esistenti prima che il form si aggiorni ?

Non so...

[artorius]

quello che intendo dire è che il select finale deve avere un nome composto da select_n + numero di select nella form? Se è così ti basta usare:

var form; //metti che qui c'è il tuo oggetto Form

var numOfSelect = 0;
var lastSelect = null;

for(i = 0; i < form.elements.length; i++)
{
   if(form.elements[i].type.toUpperCase() == 'SELECT'){
      numOfSelect++;
      lastSelect = form.elements[i];
   }
}

var newSelect = document.createElement("SELECT");
newSelect.name = "select_n"+ (numOfSelect + 1);

newSelect.insertAfter(lastSelect); 

[ubbicom]

Originariamente inviato da artorius
quello che intendo dire è che il select finale deve avere un nome composto da select_n + numero di select nella form? Se è così ti basta usare:

var form; //metti che qui c'è il tuo oggetto Form

var numOfSelect = 0;
var lastSelect = null;

for(i = 0; i < form.elements.length; i++)
{
   if(form.elements[i].type.toUpperCase() == 'SELECT'){
      numOfSelect++;
      lastSelect = form.elements[i];
   }
}

var newSelect = document.createElement("SELECT");
newSelect.name = "select_n"+ (numOfSelect + 1);

newSelect.insertAfter(lastSelect); 

Si è cosi cioè il nome della nuova select sarà select_+1rispetto alle select esistenti... scusa ma come integro la tua funzione sul codice esistente? :master:

[artorius]

se vai ad aggiungere una option alla prima select vuol dire che la form in qualche modo la ottieni. Basta che copi il codice com'è sotto quello con cui inserisci la option (nella stessa funzione) inserisci l'assegnamento giusto al var form = il reference all'oggetto form, ed il resto va da solo.

[ubbicom]

Originariamente inviato da artorius
se vai ad aggiungere una option alla prima select vuol dire che la form in qualche modo la ottieni. Basta che copi il codice com'è sotto quello con cui inserisci la option (nella stessa funzione) inserisci l'assegnamento giusto al var form = il reference all'oggetto form, ed il resto va da solo.

Ma la nuova option non la inserisco con una funzione javascript ma tramite ASP...

[artorius]

e non puoi fare lo stesso con la select?