Autosize Textbereich (Multilinie Asp: TextBox)

Question

Ich habe eine MultiLine asp: Textbox (ein Standard-HTML-Textbereich für die Nicht-Asp-Leute), die ich automatisch Größe anpassen soll, um alle Inhalte nur über CSS zu passen. Der Grund dafür ist, dass ich im Webbrowser eine bestimmte Höhe haben möchte, mit aktivierter Bildlauffunktion.

Ich habe jedoch ein Druck-Stylesheet implementiert und möchte, dass der gesamte Text im Textbereich angezeigt wird, wenn er ohne Überlauf gedruckt wird.

Ich kann die Höhe der Textarea im print.css-Dateiproblem manuell angeben, da die Felder optional sind und eine 350px leere Box nicht optimal ist und es immer die Möglichkeit einer größeren Menge an Text als dieser gibt ...

ich verwendet haben versucht:

height: auto; 
height: 100%; 

in IE und Firefox jeweils noch diese scheinen durch das Vorhandensein einer bestimmten Anzahl von Zeilen in der hTML-Aufschlags für Form außer Kraft gesetzt werden, die müssen Wird von .NET generiert, wenn Sie im asp: Textbox-Tag keine Höhe angeben, scheint dies nur kommerzielle Messungen su zu akzeptieren ch als px em etc ...

Irgendwelche Ideen?

Answer 1

Was Sie verlangen (eine CSS-Lösung) ist nicht möglich.

Der Inhalt des Textfelds ist nicht HTML-Elemente, daher kann es nicht von CSS verwendet werden, um die Größe des Textfelds zu berechnen.

Das einzige, was funktionieren könnte, wäre Javascript, z.B. Lesen Sie die scrollHeight Eigenschaft und verwenden Sie diese, um die Höhe des Elements festzulegen. Dennoch ist die scrollHeight-Eigenschaft nicht standardgemäß und funktioniert daher möglicherweise nicht in allen Browsern.

Answer 2

jQuery oder eine JavaScript-Funktion zu finden und machen area per größer könnte die beste Lösung sein - zumindest das ist, was ich

fanden wir diesen Satz von Funktionen bedienen und zu reinigen Formular aufrufen, nachdem die Seite geladen wird (Ich weiß, das ist nicht die beste Lösung hier und arbeite an einer jQuery-Lösung, die eleganter ist) - eine Anmerkung, stellen Sie sicher, dass Ihre Textfelder Zeilen und Spalten angegeben haben oder es nicht richtig funktioniert.

function countLines(strtocount, cols) 
{ 
    var hard_lines = 1; 
    var last = 0; 
    while (true) 
    { 
     last = strtocount.indexOf("\n", last + 1); 
     hard_lines++; 
     if (last == -1) break; 
    } 
    var soft_lines = Math.round(strtocount.length/(cols - 1)); 
    var hard = eval("hard_lines " + unescape("%3e") + "soft_lines;"); 
    if (hard) soft_lines = hard_lines; return soft_lines; 
} 

function cleanForm() 
{ 
    var the_form = document.forms[0]; 
    for (var i = 0, il = the_form.length; i < il; i++) 
    { 
     if (!the_form[i]) continue; 
     if (typeof the_form[i].rows != "number") continue; 
     the_form[i].rows = countLines(the_form[i].value, the_form[i].cols) + 1; 
    }  
    setTimeout("cleanForm();", 3000); 
} 

Answer 3

Wenn Sie Zeilen als lächerlich hohe Zahl festlegen, sollte die CSS-Höhenregel diese auf dem Bildschirm überschreiben.

Dann im Druck-Stylesheet nur die Höhe auf auto einstellen. Dies kann zu einem großen Leerzeichen führen, in dem alle verfügbaren Zeilen nicht ausgefüllt sind, aber zumindest der gesamte Text sichtbar ist.

Answer 4

geben jQuery automatische Vergrößerung() a go @

http://plugins.jquery.com/project/autogrow