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.
