Hi alya14,
First create a JavaScript Array and add the value in the array. Then using the sort method to sort the record in acsending order and reverse method to sort the record in descending order and append to your TextArea.
Check this example. Now please take its reference and correct your code.
Model
public class QRCodeModel
{
public string Qrcode { get; set; }
public string AddedQrcode { get; set; }
}
Controller
public class HomeController : Controller
{
// GET: /Home/
public ActionResult Index()
{
return View(new QRCodeModel());
}
}
View
<body>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
var lists = [];
$('#Qrcode').on('change', function () {
lists.push($(this).val());
lists.sort();
$("#AddedQrcode").val('');
$.each(lists, function (index, item) {
if ($("#AddedQrcode").val() != '') {
$("#AddedQrcode").val($("#AddedQrcode").val() + "\r\n" + item);
} else {
$("#AddedQrcode").val(item);
}
});
lists.reverse();
$("#AddedQrcodem").val('');
$.each(lists, function (index, item) {
if ($("#AddedQrcodem").val() != '') {
$("#AddedQrcodem").val($("#AddedQrcodem").val() + "\r\n" + item);
} else {
$("#AddedQrcodem").val(item);
}
});
});
});
</script>
<div>
<%:Html.TextBoxFor(t => t.Qrcode, new { @autocomplete = "off", @class = "form-control", placeholder = "Ürün QR Kodu" })%><br />
<%:Html.TextAreaFor(t => t.AddedQrcode, new { style = "font-size: 12px; font-weight: bold;overflow: scroll", rows = "5", @autocomplete = "off", @class = "form-control", placeholder = "Eklenen Ürün Listesi" })%>
<%:Html.TextArea("AddedQrcodem", new { style = "font-size: 12px; font-weight: bold;overflow: scroll", rows = "5", @autocomplete = "off", @class = "form-control", placeholder = "Eklenen Ürün Listesi" })%>
</div>
</body>
Screenshot
