textarea autosize.js höhe wird falsch ermittelt

[selfmade01]

Hallo,

ich benutze für ein textarea Feld das js-script autosize von http://www.jacklmoore.com/autosize/ das Textfeld passt sich zwar beim Editieren automatisch in der Höhe an, jedoch nicht wenn das Textfeld mit Daten gefüllt wird. Hier wird eine falsche Höhe berechnet.

In meinem Browser sehe ich beim Laden der Daten eine Höhe von height: 1410px und wenn ich das Feld editiere (Cursor ins Feld und Enter) eine tatsächliche Höhe von height: 357px

auf der o.g. Seite habe ich gelesne das man wohl mit einer css Anweisung das beheben kann. ich habe dazu mein Textareafeld mit folgenden Werten bestückt

<div >
<label for="form-field-information">'._("Information").'</label>
	<textarea  id="form-field-information"
	style="width: 100%;-webkit-transition: height 0.2s; -moz-transition: height 0.2s;
	transition: height 0.2s;" class="autosize-transition " 			
	placeholder="'._("Informations").'">'.$row["information"].'</textarea>
</div>

meine jquery-Anweisung lautet dazu

$('.autosize-transition').autosize();

das autosize.js wird geladen und es funktioniert auch soweit bis auf die Höhe beim erstmaligen Laden

Kennt jemand das Problem?

Grüße Jürgen

[selfmade01]

Hallo,

hatte oben eine Fehler gemacht.

zum einen habe ich es mit der jquery-funktion autosize probiert. da hatte ich die falschen Höhen

mit der js-funktion autosize.js aus dem o.g. Link wird mir das Textarea Feld zusammengeschoben und erst nachdem ich im Feld Enter drücke kommt die richtige Höhe zustande, dabei habe ich die autosiue.js Funktionen

var ta = document.querySelector('.autosize-transition');

			ta.addEventListener('autosize.resized', function(){
				console.log('textarea height updated');
			});

probiert.

klappt leider nicht

Grüße Jürgen

[selfmade01]

Hallo,

das Problem lag einfach daran das js die Funktion aufgerufen hatte bevor das textarea-feld komplett geladen wurde habe es mit

jQuery(document).ready(function() {
				checkContainer();
				});
				function checkContainer () {
				  if($('#checktext').is(':visible')){
					var ta = document.querySelector('.autosize-transition');
							
						var ta = document.querySelector('textarea');
						ta.style.display = 'none';
						autosize(ta);
						ta.style.display = '';

						var evt = document.createEvent('Event');
						evt.initEvent('autosize.update', true, false);
						ta.dispatchEvent(evt);
						alert('autosize-2-2-2-2-2');
				  } else {
					setTimeout(checkContainer, 50); //wait 50 ms, then try again
				  }
				}

erledigt

Grüße Jürgen