Javascript: scrivere in textarea da un capo di testo separato ed eliminare entry

**Tulipan0nero** · 14-11-2014, 23:06

Scusatemi avevo incollato un codice errato!
Ecco il corretto:

codice HTML:

<html>
 <head>
 <style type="text/css">
 .auto-style1 {
 text-align: left;
 color: #0000FF;
 }
 .auto-style3 {
  text-align: center;
  color: #D01A1A;
 background-color: #FFFFFF;
 }
 .auto-style4 {
 text-align: center;
 }
.auto-style5 {
 text-align: center;
 color: #0000FF;
}
 .auto-style6 {
  text-align: center;
  color: #0000FF;
  font-size: x-large;
  background-color: #FFFFFF;
 }
 .auto-style9 {
  background-color: #FFFFFF;
  color: #0000FF;
 }
 .auto-style8 {
  border-width: 0;
 }
 .auto-style12 {
 text-align: left;
 background-color: #FFFFFF;
 font-family: Arial, Helvetica, sans-serif;
 font-size: small;
}
.auto-style14 {
 background-color: #FFFFFF;
}
.auto-style16 {
 font-family: Arial, Helvetica, sans-serif;
 font-size: small;
}
.auto-style17 {
 text-align: center;
 color: #000080;
 font-family: Arial, Helvetica, sans-serif;
}
.auto-style18 {
 text-align: center;
 background-color: #FFFFFF;
 font-family: Arial, Helvetica, sans-serif;
 font-size: small;
}
.auto-style19 {
 font-size: small;
}
.auto-style20 {
 text-align: center;
 color: #000080;
 font-family: Arial, Helvetica, sans-serif;
 font-size: small;
}
 .auto-style24 {
  text-align: left;
  color: #000080;
  font-family: Arial, Helvetica, sans-serif;
  font-size: small;
 }
 </style>
</head>
<body style="background-color: #99CCFF">
<div class="auto-style4">
<p>&nbsp;</p>
<table style="width: 60%" align="center" class="auto-style6">
 <tr>
  <td class="auto-style3"><strong>
  <img alt="" height="163" src="logo_lazarus.png" width="385"><br>
  <span class="auto-style9">C4I Onboard Lazarus</span><span class="u"><br>
  </span></strong><span class="u"><strong>Inserimento operatori C4I di 
  bordo</strong></span></td>
 </tr>
 <tr>
  <td class="auto-style14">
  <img alt="" class="auto-style5" height="229" src="newusers.jpg" width="220" /></td>
 </tr>
 <tr>
  <td>&nbsp;</td>
 </tr>
 <tr>
  <td class="auto-style14"><form id="imbarcazioni" name="imbarcazioni" method="post" action="prepare.php" >
    <div class="auto-style4">
  <table border="0" align="center" cellpadding="2" cellspacing="0" style="height: 396px; width: 439px;" class="auto-style14">
    <tr>
      <td class="auto-style24" style="width: 91px">
 
   <strong>Grado</strong>
 
<span class="auto-style16"> &nbsp;</span></td>
      <td width="188" class="auto-style24" style="width: 94px">
 
<select name="grado" id="grado" onkeypress="generateFullName()" class="auto-style16">
    <optgroup label="Grado">
        <option value="Aps.">Aps.</option>
        <option value="Maa.">Maa.</option>
        <option value="Mac.">Mac.</option>
        </optgroup>
        </select></td>
    </tr>
    <tr>
      <td class="auto-style24" style="width: 91px">
 
   <strong>Nome</strong></td>
      <td width="188" class="auto-style20" style="width: 94px">
   <input name="nome" type="text" class="auto-style79" onkeyup="generateFullName()" id="nome" style="width: 200px"></td>
    </tr>
    <tr>
      <td class="auto-style24" style="width: 91px">
 
   <strong>Cognome</strong></td>
      <td width="188" class="auto-style20" style="width: 94px">
   <input name="cognome" type="text" class="auto-style79" id="cognome" onkeyup="generateFullName()" style="width: 200px"></td>
    </tr>
    <tr>
      <td class="auto-style24" style="width: 91px">
 
   <strong>Matricola</strong></td>
      <td width="188" class="auto-style20" style="width: 94px">
   <input name="matricola" type="text" class="auto-style79" id="matricola" onkeyup="generateFullName()" style="width: 200px"></td>
    </tr>
    <tr>
      <td class="auto-style24" colspan="2">
 
   <input type="text" id="dest" style="width: 328px" name="dest" value=""><input type="button" value="Aggiungi" onclick="addtext();"></td>
 </tr>
      <tr>
      <td class="auto-style18" colspan="2"> <div id="txtHint" class="auto-style17">
    <p class="auto-style19"><span class="auto-style16"> 
   <textarea name="lista_utenti" id="lista_utenti" cols="50" rows="10"></textarea></span></p>
    <p class="auto-style19"><span class="auto-style16"> 
    <input name="Submit0" type="submit" value="Rimuovi utente selezionato"></span></p>
   </div></td>
    </tr>
    <tr class="auto-style1">
      <td class="auto-style12" colspan="2">
   <p class="auto-style4">
   <br class="auto-style16">
 <input name="Submit" type="submit" value="Inserisci lista utenti"><br class="auto-style16">
     </p>
     </td>
    </tr>
    </table>
    </div>
    </form>
           </tr>
  </table>
 &nbsp;<br>
   <br />
 <tr>
  <td><a href="index.html">
  <img alt="" class="auto-style8" height="58" src="home.png" width="58"></a></td>
 </tr>
 <tr>
  <td>&nbsp;</td>
 </tr>
 <tr>
  <td class="auto-style11">
  <br>
  <img alt="" height="48" src="almaviva.jpg" width="200"></td>
 </tr>
</div>
</body>   
<script type="text/javascript">
    function generateFullName()
    {
        document.getElementById('dest').innerText = 
            document.getElementById('matricola').value + ' ' + 
            document.getElementById('nome').value+ ' ' + 
            document.getElementById('cognome').value+ ' ' + 
            document.getElementById('grado').value;
    };
function InserisciTesto(testo){
    document.getElementById("lista_utenti").value += testo;
};
function addtext() {
 var newtext = document.imbarcazioni.dest.value;
 document.imbarcazioni.lista_utenti.value += newtext;
}
</script>
</html>

Sostanzialmente a questo codice va fatta la seguente correzione:
1)Quando inserisco le linee nella textarea vorrei venissero inserite su righe diverse;
2)Cliccando sul pulsante in basso vorrei salvare il contenuto della textarea su di un file di testo in locale;
Come fare?

Saluti

Originariamente inviata da Tulipan0nero

Ciao a tutti,
ho creato una pagina strutturata in questo modo:
ho una listbox e due campi di testo che riempio ed il cui output compare concatenato su di un
altro campo. Nello specifico ho un drop down menù da cui seleziono il Grado (App, Mar, Com) ed altri tre campi si cui scrivo Nome, Cognome e Matricola.
Vorrei questi 4 inserimenti comparissero concatenati in un campo unico sotto:
Mar. Rossi Alberto w347611 (ad esempio)
Cliccando poi su di un pulsante AGGIUNGI questa riga viene di fatto aggiunta ad una linea della mia
textarea. Posso quindi procedere con altri inserimenti.
Quando ho finito vorrei che cliccando sul pulsante Submit in basso alla pagina il contenuto della textarea venite salvato su di un file in locale, ad esempio c:\utenti.txt

Questa è parte del codice che ho scritto ma che on funziona...e non capisco dove sbaglio:

newuser.html

codice HTML:

<html>
 <head>
 <style type="text/css">
 .auto-style1 {
 text-align: left;
 color: #0000FF;
 }
 .auto-style3 {
  text-align: center;
  color: #D01A1A;
 background-color: #FFFFFF;
 }
 .auto-style4 {
 text-align: center;
 }
.auto-style5 {
 text-align: center;
 color: #0000FF;
}
 .auto-style6 {
  text-align: center;
  color: #0000FF;
  font-size: x-large;
  background-color: #FFFFFF;
 }
 .auto-style9 {
  background-color: #FFFFFF;
  color: #0000FF;
 }
 .auto-style8 {
  border-width: 0;
 }
 .auto-style12 {
 text-align: left;
 background-color: #FFFFFF;
 font-family: Arial, Helvetica, sans-serif;
 font-size: small;
}
.auto-style14 {
 background-color: #FFFFFF;
}
.auto-style16 {
 font-family: Arial, Helvetica, sans-serif;
 font-size: small;
}
.auto-style17 {
 text-align: center;
 color: #000080;
 font-family: Arial, Helvetica, sans-serif;
}
.auto-style18 {
 text-align: center;
 background-color: #FFFFFF;
 font-family: Arial, Helvetica, sans-serif;
 font-size: small;
}
.auto-style19 {
 font-size: small;
}
.auto-style20 {
 text-align: center;
 color: #000080;
 font-family: Arial, Helvetica, sans-serif;
 font-size: small;
}
 .auto-style24 {
  text-align: left;
  color: #000080;
  font-family: Arial, Helvetica, sans-serif;
  font-size: small;
 }
 </style>
</head>
<body style="background-color: #99CCFF">
<div class="auto-style4">
<p>&nbsp;</p>
<table style="width: 60%" align="center" class="auto-style6">
 <tr>
  <td class="auto-style3"><strong>
  <img alt="" height="163" src="logo_lazarus.png" width="385"><br>
  <span class="auto-style9">C4I Onboard Lazarus</span><span class="u"><br>
  </span></strong><span class="u"><strong>Inserimento operatori C4I di 
  bordo</strong></span></td>
 </tr>
 <tr>
  <td class="auto-style14">
  <img alt="" class="auto-style5" height="229" src="newusers.jpg" width="220" /></td>
 </tr>
 <tr>
  <td>&nbsp;</td>
 </tr>
 <tr>
  <td class="auto-style14"><form id="imbarcazioni" name="imbarcazioni" method="post" action="prepare.php" >
    <div class="auto-style4">
  <table border="0" align="center" cellpadding="2" cellspacing="0" style="height: 396px; width: 439px;" class="auto-style14">
    <tr>
      <td class="auto-style24" style="width: 91px">
 
   <strong>Grado</strong>
 
<span class="auto-style16"> &nbsp;</span></td>
      <td width="188" class="auto-style24" style="width: 94px">
 
<select name="grado" id="grado" " class="auto-style16">
    <optgroup label="Grado">
        <option value="Aps.">Aps.</option>
        <option value="Maa.">Maa.</option>
        <option value="Mac.">Mac.</option>
        </optgroup>
        </select></td>
    </tr>
    <tr>
      <td class="auto-style24" style="width: 91px">
 
   <strong>Nome</strong></td>
      <td width="188" class="auto-style20" style="width: 94px">
   <input name="nome" type="text" class="auto-style79" value="" id="nome" style="width: 200px" /></td>
    </tr>
    <tr>
      <td class="auto-style24" style="width: 91px">
 
   <strong>Cognome</strong></td>
      <td width="188" class="auto-style20" style="width: 94px">
   <input name="cognome" type="text" class="auto-style79" id="cognome" value="" style="width: 200px" /></td>
    </tr>
    <tr>
      <td class="auto-style24" style="width: 91px">
 
   <strong>Matricola</strong></td>
      <td width="188" class="auto-style20" style="width: 94px">
   <input name="matricola" type="text" class="auto-style79" id="matricola" value="" style="width: 200px" /></td>
    </tr>
    <tr>
      <td class="auto-style24" colspan="2">
 
   <input type="text" id="dest" style="width: 328px" name="dest" value=""><input name="Submit1" type="submit" value="Aggiungi" /></td>
 </tr>
      <tr>
      <td class="auto-style18" colspan="2"> <div id="txtHint" class="auto-style17">
    <p class="auto-style19"><span class="auto-style16"> 
   <textarea name="lista_utenti" id="lista_utenti" cols="50" rows="10"></textarea></span></p>
    <p class="auto-style19"><span class="auto-style16"> 
    <input name="Submit0" type="submit" value="Rimuovi utente selezionato"></span></p>
   </div></td>
    </tr>
    <tr class="auto-style1">
      <td class="auto-style12" colspan="2">
   <p class="auto-style4">
   <br class="auto-style16">
 <input name="Submit" type="submit" value="Inserisci lista utenti"><br class="auto-style16">
     </p>
     </td>
    </tr>
    </table>
    </div>
    </form>
           </tr>
  </table>
 &nbsp;<br>
   <br />
 <tr>
  <td><a href="index.html">
  <img alt="" class="auto-style8" height="58" src="home.png" width="58"></a></td>
 </tr>
 <tr>
  <td>&nbsp;</td>
 </tr>
 <tr>
  <td class="auto-style11">
  <br>
  <img alt="" height="48" src="almaviva.jpg" width="200"></td>
 </tr>
</div>
</body>   
<script type="text/javascript">
$(document).ready(function(){
    $("#matricola, #grado, #nome, #cognome").change(function(){
        concatenated_string = $("#matricola").val() + " " + $("#grado").val() + " " + $("#nome").val() + " " + $("#cognome").val();
        $("#dest").val(concatenated_string);
       })
})
</script>
</html>

Ogni consiglio sarà ben accetto!

Grazie!!

Tiziano

Discussione: Javascript: scrivere in textarea da un capo di testo separato ed eliminare entry

Strumenti discussione

Ricerca discussione

Visualizza

Visualizzazione discussione

Permessi di invio