Carriage Return / Neue Zeile in Textareas
Eine kleine Aufgabe: Jede neue Textzeile (Carriage Return/Wenn man Enter drückt 
) in einer Textarea soll ein Element in einer Auflistung sein – wie mach ich das jetzt am einfachsten?
Eigentlich ein grundlegendes Element im Web und der Nutzer macht bewusst Absätze – daher wäre es nur gerecht, wenn man das auch entsprechend würdigt.
Kleine MVC Demo App:
Wir wollen die Eingaben in diesem Textfeld etwas näher analysieren. In meiner Variante geschieht das “splitten” auf der Server-Seite, allerdings wäre es über Javascript natürlich genauso möglich.
Nach dem OK Klick:
Der Controller nimmt den Eingabetext entgegen. Wenn der Nutzer [Enter] in der Textarea drückt, kommt als “Steuerzeichen” entweder ein \n oder \r\n mit (ich glaub das hängt mit den Betriebssystemen zusammen… lange Geschichte )
Damit müssen wir den String nur noch bei diesen Zeichen splitten und schon können wir die einzelnen Absätze besonders behandeln:
public ActionResult Multiline(string input)
{
ViewBag.MultilineRaw = input;
List<string> eachLine = input.Split(new string[] { "\n", "\r\n" }, StringSplitOptions.RemoveEmptyEntries).ToList();
ViewBag.MultilineSplitted = eachLine;
return View("Index");
}
View:
@using(Html.BeginForm("Multiline", "Home"))
{
@Html.TextArea("input")
<button>OK</button>
}
@if(string.IsNullOrWhiteSpace(ViewBag.MultilineRaw) == false)
{
<h2>Input</h2>
<p>Raw: @ViewBag.MultilineRaw</p>
<h3>Each Line</h3>
<ul>
@foreach(var line in @ViewBag.MultilineSplitted)
{
<li>@line</li>
}
</ul>
}
Endergebnis:
Keine große Sache – aber vielleicht hilft es den einen oder anderen weiter.
About the author
Written by Robert Mühsig
Robert Mühsig (@robert0muehsig) ist Webentwickler und beschäftigt sich mit Web-Frameworks (vor allem dem ASP.NET MVC Framework) und scheut sich auch nicht vor Javascript. Ansonsten bloggt er über all jene Probleme, die ihm über den Weg laufen. Seit 2008 ist er Microsoft MVP für ASP.NET und er arbeitet bei der T-Systems Multimedia Solutions GmbH in Dresden. Treffen kann man ihn online via Twitter (@robert0muehsig) oder dieser Seite oder bei der .NET User Group Dresden.
Letzte Kommentare