Impossibile aggiornare textarea con javascript dopo averlo scritto manualmente

Question

Sto scrivendo un'applicazione online in cui salvavo alcuni testi nel database.
Ci sono 5 "textarea" -s e 5 "input type = text" -s.
Sto anche implementando una ricerca per trovare e modificare facilmente le voci del DB. Viene visualizzata una nuova finestra di selezione (utilizzando prototipo e ajax) e quando si fa clic su una delle sue voci viene compilato il modulo sottostante (è lo stesso modulo utilizzato per aggiungere nuovi risultati). Ora il problema sorge ...
Se aggiungo un nuovo modulo o modifico uno esistente TUTTI i campi TEXTAREA che sono stati modificati, si bloccano o qualcosa del genere (solo le aree di testo, gli input funzionano ancora) ... Essi non obbedirà più a Javascripts. Update più, quindi non cambiano quando seleziono la voce successiva .... O ALMENO HANNO WONT IN FireFox (3.5 Qualcosa). Funziona bene in IE, ma dal momento che sono un utente FF e non ci lavoro anche io mi chiedo se qualcuno ha incontrato problemi simili e risolto con facilità.
Il problema sembra andare via quando chiamo form.reset(), ma questo rovina alcuni campi di selezione/opzione generati dal codice, inoltre non voglio che i dati rimangano.

Per me sembra che FF abbia deciso che il testo che ho inserito è più importante del testo che javascript sta cercando di inserire, quindi lo sovrascrive ... e non riesco a capire perché. A questo punto sto incolpando .update(), ma non sono sicuro di come farlo altrimenti.
I campi INPUT sembrano avere problemi con .update (o semplicemente non ha funzionato per me), quindi ho dovuto riscriverli su .value = (ho provato .valore anche con textareas, sperando che possa risolvere qualsiasi cosa, purtroppo senza alcun risultato).

Quindi, qualcuno ha qualche indizio sul perché questo sta accadendo e su come risolverlo, senza dover reimpostare il modulo su ogni passaggio?

Answer 1

.valore e.innerHTML sembrava risolvere il problema

Answer 2

Ho questo problema esatto. Finora ho provato

$('#addofferlink').click(function(){ 
    var offer = "#OFFER_"+$('#offer_id').val()+"#"; 
    $('#message').append(offer); 
}); 

Ho anche provato,

$('#addofferlink').click(function(){ 
    var e = $('#message').html(); 
    var offer = "#OFFER_"+$('#offer_id').val()+"#"; 
    $('#message').html(e+offer); 
}); 

Il problema sembra essere che se l'utente digita nella textarea (#message) e poi fa clic sul pulsante per aggiungere il link all'offerta , non viene visualizzato nulla. Osservando la fonte, usando Firebug, posso vedere che il testo reale contenuto nella textarea è stato modificato, ma non è visualizzato sullo schermo.

Sembra che il javascript stia modificando i contenuti html del tag, ma il browser sta memorizzando i contenuti attualmente digitati in memoria (presumo) o altrove.

L'aggiornamento della textarea mediante val (e + offer) rimuove il testo inserito e lo sostituisce con il link dell'offerta, e utilizzando innerHTML = e + l'offerta non funziona affatto, non mostrando alcuna modifica nell'area di testo.

---

Sono riuscito a ordinare questo!

Il mio pensiero ruotava intorno al fatto che, poiché il tag contiene il testo e ha il proprio tag di chiusura, che avrei dovuto ottenere il suo contenuto usando .html().

Utilizzando .val() per ottenere il contenuto del campo è possibile quindi estrarre e aggiornare il contenuto semplicemente. Ho finito con il seguente,

$('#addofferlink').click(function(){ 
    var e = $('#message').val(); 
    var offer = "#OFFER_"+$('#offer_id').val()+"#"; 
    $('#message').val(e+offer); 
}); 

Answer 3

ho risolto questo problema strano semplicemente:

document.forms[0].text_area_name.value = "STUFF"; 

Anche dopo la modifica del textarea lo script sovrascriverà.

innerHTML non ha funzionato per me dopo aver modificato la textarea.

Answer 4

Ho avuto lo stesso problema. Quando HTML è l'analisi di oggetti DOM, il contenuto di textarea è innetHTML di <textarea>

<textarea cols="10" rows="10">Content of textarea</textarea> 

Valori document.getElementByTagName('textarea').innerHTML e document.getElementByTagName('textarea').value restituisce questo stesso valore Content of textarea

Ma dopo oggetto carico DOM, cambiando innerHTML valore non cambia il contenuto di textarea scatola. Una soluzione per cambiarlo è la modifica del campo value.

document.getElementByTagName('textarea').value="New content of textarea"; 

o in jquery

$("textarea").val("New content of textarea"); 

Answer 5

A volte si potrebbe desiderare di visualizzare in una textarea, una particolare stringa e lasciare all'utente di vedere quello che è, poi eventualmente apportare modifiche ad esso; ma, desideri abilitarli a vedere qual era il testo originale. Le aree di testo sono piuttosto ingombranti, , ma anche una modifica manuale nel testo modificato è reversibile utilizzando questa impostazione.

<button id="ShowNOWxItmDscptn" onClick="EditItmDesc(1)">What is it now?</button> 
<button id="OpnTAxWriteNewEdit" onClick="EditItmDesc(2)">Write/Edit</button> 
<textarea id="RUBYxDescribe" max="500" width="75" placeholder="Magic"> </textarea> 

// a global variable: 
// UVarDescriptionTxt = ("This is the first line.\r\nSecond line!"); 

function EditItmDesc(x){ 
    console.log("*x* = "+x+"."); 
    console.log("Text to reset : "+UVarDescriptionTxt+"."); 

    var InnyShow = document.getElementById("RUBYxDescribe"); 
    InnyShow.value = UVarDescriptionTxt; 

    if(x == 1) { 
     InnyShow.innerHTML = ""; 
     InnyShow.textContent = ""; 
     InnyShow.innerHTML = UVarDescriptionTxt; 
    } 

    if(x == 2){ 
     InnyShow.value = ""; 
    } 
} 

La struttura di cui sopra ha risolto il problema per me.