Gestione funzione in javascript in tabella richiamare"textarea" valori preimpostati in "select"

psicomia

Nuovo Utente
9 Giu 2019
5
0
1
Buonasera, premetto che ho un po' di dimestichezza con html e css, non sono autonoma ma riesco a capirlo e reinterpretarlo, ma non so quasi nulla di javascript.
Ho necessità di creare un mio modulo per poter gestire alcune informazioni e creazioni di contenuti, che nel tempo potrenno ritornarmi utili (unità didattiche di apprendimento, insegno alla primaria).
Sono riuscita a compilare la prima parte del modulo, ma ora sono ferma sulla seconda parte del modulo.
Vorrei creare una tabella dove nella prima cella delle righe inserirei il macro-argomento e nelle successive celle della riga di riferimento vorrei che in una textarea comparissero le oprzoni che ho già preimpostato e corrispondenti alla prima cella.
Ho trovato una cosa simile online però agiscono tramite form e mettendole in tabella non funzionano.
Posto il codice che ho trovato e sotto ci sarà l'impostazione grafica di quello che serve a me.
Vi ringrazio in anticipo per l'eventuale aiuto!
Ho ancora molto da imparare e spero di riuscire a gestire l'eventuale codice che mi suggerirete.
Codice:
<html>
  <head>
    
    <title>Prova valutazione UDA</title>
<style>
    table.tabella{
    border: 2px solid #CCCCCC;
}

table.tabella td{
    background-color : #FAEBD7;
    color : back;
    padding : 2px;
    text-align: center;
    font-size: 14px;
}

table.tabella tr{
    background-color : white;
    color : back;
    padding : 2px;
    text-align: center;
    font-size: 14px;
}
</style>

    <script language="javascript">
/* Questo codice l'ho preso online, vorrei funzionasse in maniera simile nella mia tabella*/
/*Questa funzione legge il valore passato come parametro e dato il valore aggiunge delle opzioni agli altri campi*/

function selezionaOpzioni(scelta) {
/*Resetto le opzioni precedenti del campo*/
var campo_der = document.form.campo_der;
campo_der.options.length = 0;
/*verifico la scelta e aggiungo i campi*/
if (scelta == "1") {
campo_der.options[campo_der.options.length] = new Option('Pomodoro');
campo_der.options[campo_der.options.length] = new Option('Mozzarella');
campo_der.options[campo_der.options.length] = new Option('Basilico');
}
if (scelta == "2") {
campo_der.options[campo_der.options.length] = new Option('Pomodoro');
campo_der.options[campo_der.options.length] = new Option('Aglio');
campo_der.options[campo_der.options.length] = new Option('Origano');
}
if (scelta == "3") {
campo_der.options[campo_der.options.length] = new Option('Pomodoro');
campo_der.options[campo_der.options.length] = new Option('Funghi');
campo_der.options[campo_der.options.length] = new Option('Olive');
campo_der.options[campo_der.options.length] = new Option('Carciofini');
}
}
function aggiornaOpzioni(scelta){
var selezionato = document.form.campo_principale.selectedIndex;
var campo = document.form.campo_principale.options;
selezionaOpzioni(campo[selezionato].value);
}
</script>
  </head>
  <body>
 <form name="form">
Seleziona Pizza:
<select name="campo_principale" size="1" onChange="aggiornaOpzioni();">
<option value="1">Pizza Margherita</option>
<option value="2">Pizza Marinara</option>
<option value="3">Pizza Capricciosa</option>
</select>
<br />
<br />
Seleziona Ingrediente:
<select name="campo_der" size="1">
</select>

</form>




<div style=" text-align: left; text-indent: 0px; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px;">

<table width="100%" border="1" cellpadding="1" cellspacing="1" class="tabella">

<tr class="tabella">
<td class="tabella">

<span style=" font-size: 10pt; font-family: 'Arial', 'Helvetica', sans-serif; font-style: normal;">MACRO-AREA</span>
</td>

<td class="tabella">
<span style=" font-size: 10pt; font-family: 'Arial', 'Helvetica', sans-serif; font-style: normal;">LIVELLO 4</span>
</td>

<td class="tabella">
<span style=" font-size: 10pt; font-family: 'Arial', 'Helvetica', sans-serif; font-style: normal;">LIVELLO 3</span>
</td>

<td class="tabella">
<span style=" font-size: 10pt; font-family: 'Arial', 'Helvetica', sans-serif; font-style: normal;">LIVELLO 2</span>
</td>

<td class="tabella">
<span style=" font-size: 10pt; font-family: 'Arial', 'Helvetica', sans-serif; font-style: normal;">LIVELLO 1</span>
</td>
</tr>

     <tr class="tabella">
     <td class="tabella">
     <select name="campo_principale" size="1" onChange="aggiornaOpzioni();">
     <option value="1">Scrittura</option>
     <option value="2">Lettura</option>
     <option value="3">Contenuto</option>
     </select>
     </td>
<td class="tabella">
<textarea name="campo_der" rows="5" cols="" ></textarea>
</td>
<td class="tabella">
<textarea name="" rows="5" cols="" ></textarea>
</td>
<td class="tabella">
<textarea name="" rows="5" cols="" ></textarea>
</td>
<td class="tabella">
<textarea name="" rows="5" cols="" ></textarea>
</td>

</tr>
</table>
</div>

  </body>
</html>
 

macus_adi

Utente Attivo
5 Dic 2017
1.333
90
48
IT/SW
La logica è abbastanza semplice, prima di tutto carico tutti i modelli ossia "Array di Oggetti", quando selezione /cambio selezione dell'item eseguo la funzione getModel prelevando il valore corrente.
Premessa doverosa:
Codice:
allModel=[['type':'Tipo 1','data':[],...... [... ];

Codice:
event:{
    'change .items':'getModel',
}
currentModel:{},
allModel:[],
loadModel:function(){
     var self=this;
     self.call('/api/getModel').then(function(response){
            self.allModel=response.data;
     });
},
getModel:function(e){
     var self=this;
     for(var i in this.allModel){
          if($(e.currentTarget+'option:selected') === this.allModel[i].type) this.currentModel=this.allModel[i].data;
     }
}
 

psicomia

Nuovo Utente
9 Giu 2019
5
0
1
Grazie, sei stato molto gentile a rispondermi. Appena riuscirò ad orientarmi ti farò sapere se funziona.
 
Discussioni simili
Autore Titolo Forum Risposte Data
A Creazione cookie e gestione accessi PHP 0
B form gestione input PHP 2
sbolde91 Consiglio gestione Hosting Hosting 0
E Gestione profilo utente tramite Form PHP 3
S cerco esperto gestione ecommerce Offerte e Richieste di Lavoro e/o Collaborazione 0
P Curiosità su grandi aziende e la gestione delle grafiche. Discussioni Varie 1
M Consiglio sulla gestione di Gerarchie Database 0
A attributo "min" per input gestione date PHP 8
L Gestione DB ASP.NET 2
L Consiglio SEO gestione dominio + free hosting SEO e Posizionamento 3
G [PHP] gestione mouse PHP 2
B Gestione Prenotazioni con Mysql Database 21
D CREAZIONE E GESTIONE SITO E-COMMERCE Offerte e Richieste di Lavoro e/o Collaborazione 2
P (Cerco) Collaboratori per gestione social media Offerte e Richieste di Lavoro e/o Collaborazione 5
brasoft2019 [PHP] Sistema di gestione presenze PHP 29
W Preventivo gestione ecommerce Discussioni Varie 1
E Cerco partner / socio per gestione sito di annunci incontri Offerte e Richieste di Lavoro e/o Collaborazione 0
K e-commerce per distribuzione e dettaglio con gestione magazzino E-Commerce 0
G [MS Access] Gestione biglietti [RISOLTO] MS Access 2
Jonn [WordPress] Gestione categorie e tags per sito eventi WordPress 2
felino Gestione dispositivi e Altri dispositivi Windows e Software 4
D Software per gestione account facebook? Social Media Marketing 1
D Cero Software Facebook gestione account Vendere e Acquistare pubblicita' online 0
M Offro servizio Incremento Follower e Gestione Profili Istagram Offerte e Richieste di Lavoro e/o Collaborazione 0
S elementi statistici - Matrice e Gestione Array PHP o Javascript Javascript 0
J [offro] hosting / installazione certificati ssl / gestione server Offerte e Richieste di Lavoro e/o Collaborazione 0
F [PHP] gestione meteo manuale per un gioco di ruolo PHP 1
bianca_dimulescu Gestione tabella e MySQL PHP 4
T Servizio gestione pagina Instagram Offerte e Richieste di Lavoro e/o Collaborazione 0
G Gestione e/o vendita hosting come libero professionista Leggi, Normative e Fisco 4
MatMac System [PHP] Gestione dinamica select-option PHP 3
xone [Vendo] Script gestionale php-mysql gestione pratiche Altri Annunci 0
S [PHP] Gestione coupon PHP 3
lxella [PHP] Aree riservate e gestione utenti PHP 1
D Gestione punteggi php PHP 1
B Cercasi socio per gestione sito web Offerte e Richieste di Lavoro e/o Collaborazione 0
G gestione pagina facebook Social Media Marketing 0
Cavalinho08 [Offro gestione pagine instagram, prezzo bassissimo] Annunci servizi di Social Media Marketing 3
D [VENDO] Gestione account instagram Annunci servizi di Social Media Marketing 2
N [VENDO] Gestione pagine FB Annunci servizi di Social Media Marketing 2
ientii [PHP] Gestione CheckBox PHP 1
W Consiglio su gestione di un form con XMLHttpRequest Ajax 0
booklisa Compressione immagini e gestione media CMS (Content Management System) 1
T gestione livelli sessioni php msqli PHP 1
giuseppe_123 [PHP] Gestione corsi PHP 1
A [WordPress] Plugin gestione ordine prodotto. WordPress 0
V [PHP] [OOP]Gestione errori connessione db PHP 5
R [PHP] Software gestione interventi e creazione registro (log) PHP 1
C [RETRIBUITO] Sviluppo applicazione web gestione fantacalcio Offerte e Richieste di Lavoro e/o Collaborazione 0
L [PHP] gestione $_GET che non funziona per colpa di mod_rewrite? PHP 1

Discussioni simili