MVC Net 6 Get Object from SelectList using its id - asp.net-mvc

Question

Hello i am triying to figure out how to get the object after is selected in the selectlist, the selectlist holds the "Id" field and "Code" field, but i want to get access to the other fields of the object after is selected. I would like to show the "Amount" field and the "Coin.Name" of the object in the view after the selecction.
Order Model
public class Order
{
[Required]
[Key]
public int Id { get; set; }
[ForeignKey("Id")]
[Display(Name = "Proveedor")]
public int ProviderId { get; set; }
[Display(Name = "Proveedor")]
public virtual Provider Provider { get; set; } = null!;
[ForeignKey("Id")]
[Display(Name = "Pais")]
public int CountryId { get; set; }
[Display(Name = "Pais")]
public virtual Country Country { get; set; } = null!;
[ForeignKey("Id")]
[Display(Name = "Categoria")]
public int CategoryId { get; set; }
[Display(Name = "Categoria")]
public virtual Category Category { get; set; } = null!;
[Required]
[StringLength(100)]
[Display(Name = "Coigo de Orden")]
public string Code { get; set; } = null!;
[Required]
[Display(Name = "Moneda")]
public int CoinId { get; set; }
[Display(Name = "Moneda")]
public virtual Coin Coin { get; set; } = null!;
[Required]
[Display(Name = "Monto")]
[Precision(18, 2)]
public decimal Amount { get; set; }
[Required]
[DisplayFormat(DataFormatString = "{0:dd-MM-yyyy}", ApplyFormatInEditMode = true)]
[Display(Name = "Fecha")]
public DateTime Date { get; set; }
[Required]
[DisplayFormat(DataFormatString = "{0:dd-MM-yyyy}", ApplyFormatInEditMode = true)]
[Display(Name = "Fecha Tope")]
public DateTime DateEnd { get; set; }
[ForeignKey("Id")]
[Display(Name = "Comprador")]
public int BuyerId { get; set; }
[Display(Name = "Comprador")]
public virtual Buyer Buyer { get; set; } = null!;
[StringLength(500)]
[Display(Name = "Comentarios")]
public string Comments { get; set; }
[StringLength(500)]
[Display(Name = "Campo 1")]
public string Field1 { get; set; }
[StringLength(500)]
[Display(Name = "Campo 2")]
public string Field2 { get; set; }
[StringLength(500)]
[Display(Name = "Campo 3")]
public string Field3 { get; set; }
[StringLength(500)]
[Display(Name = "Campo 4")]
public string Field4 { get; set; }
[ForeignKey("Id")]
public int AuditUserId { get; set; }
public virtual User AuditUser { get; set; } = null!;
public DateTime AuditDateTime { get; set; }
public bool AuditDelete { get; set; }
}
Coin Model
public class Coin
{
[Required]
[Key]
public int Id { get; set; }
[Required]
[StringLength(100)]
[Display(Name = "Nombre")]
public string Name { get; set; }
[ForeignKey("Id")]
public int AuditUserId { get; set; }
public virtual User AuditUser { get; set; } = null!;
[Required]
public DateTime AuditDateTime { get; set; }
[Required]
public bool AuditDelete { get; set; }
}
Create Controller
public async Task<IActionResult> Create(int idPayment)
{
ViewData["id"] = idPayment;
ViewData["OrderId"] = new SelectList(_context.Orders.Include(o => o.Coin).Where(x => x.AuditDelete == false).OrderBy(x => x.Code), "Id", "Code");
ViewData["PaymentStatusId"] = new SelectList(_context.PaymentsStatus.Where(x => x.AuditDelete == false).OrderBy(x => x.Status), "Id", "Status");
return View();
}
Create View
#model WebApplicationDailyPayments.Models.Database.PaymentDetails
#{
ViewData["Title"] = "Crear";
}
<h1>Crear</h1>
<h4>Detalle de pagos</h4>
<hr />
<div class="row">
<div class="col-md-4">
<form asp-action="Create">
<div asp-validation-summary="ModelOnly" class="text-danger"></div>
<div class="form-group">
<label asp-for="PaymentId" class="control-label"></label>
<select asp-for="PaymentId" class ="form-control" asp-items="ViewBag.PaymentId"></select>
</div>
<div class="form-group">
<label asp-for="OrderId" class="control-label"></label>
<select asp-for="OrderId" class ="form-control" asp-items="ViewBag.OrderId"></select>
</div>
<div class="form-group">
<label asp-for="PaymentStatusId" class="control-label"></label>
<select asp-for="PaymentStatusId" class ="form-control" asp-items="ViewBag.PaymentStatusId"></select>
</div>
<div class="form-group">
<label asp-for="AmountPaid" class="control-label"></label>
<input asp-for="AmountPaid" class="form-control" id="AmountPaid" />
<span asp-validation-for="AmountPaid" class="text-danger"></span>
</div>
<div class="form-group">
<label asp-for="Rate" class="control-label"></label>
<div class="form-check form-switch">
<input class="form-check-input" type="checkbox" id="rateChecked" checked="">
<label class="form-check-label" for="flexSwitchCheckChecked">Multiplicar - Dividir</label>
</div>
<input asp-for="Rate" class="form-control" id="Rate"/>
<span asp-validation-for="Rate" class="text-danger"></span>
</div>
<div class="form-group">
<label asp-for="AmountPaidFinal" class="control-label"></label>
<input asp-for="AmountPaidFinal" class="form-control" id="AmountPaidFinal" readonly />
<span asp-validation-for="AmountPaidFinal" class="text-danger"></span>
</div>
<br/>
<div class="form-group">
<input type="submit" value="Crear" class="btn btn-primary" /> <a class="btn btn-primary" asp-action="Index" asp-route-idPayment="#ViewData["id"]">Regresar a la Lista</a>
</div>
</form>
</div>
</div>
#section Scripts {
#{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
<script>
$(function(){
$("#AmountPaid,#Rate").keyup(function (e) {
var q=$("#AmountPaid").val().toString().replace(",",".");
var p = $("#Rate").val().toString().replace(",", ".");
var c = document.getElementById('rateChecked');
var result=0;
if(q!=="" && p!=="" && $.isNumeric(q) && $.isNumeric(p))
{
if(c.checked)
{
result = parseFloat(q) * parseFloat(p);
}
else
{
result = parseFloat(q) / parseFloat(p);
}
}
$("#AmountPaidFinal").val((Math.round(result * 100) / 100).toString().replace(".", ","));
});
});
</script>
}
Edit 1
I added in the controller to pass the Orders to the view
ViewData["Orders"] = _context.Orders.Include(o => o.Coin).Where(x => x.AuditDelete == false).ToList();
I added in the view to get the orders
#{
foreach (var item in (IEnumerable<WebApplicationDailyPayments.Models.Database.Order>)(ViewData["Orders"]))
{
var a = item.Id;
}
}
Now i get the Orders in the view, now i need to filter by Id selecetd in the selectlsit
Thank you

Answer 1

You can monitor select changes to perform corresponding operations.
Below is my test code, you can refer to it.
In the view, I use JavaScript to monitor whether the select changes, so as to obtain the selected Id for matching:
<div class="form-group">
<label asp-for="OrderId" class="control-label"></label>
<select id="my_select" asp-for="OrderId" class="form-control" asp-items="#ViewBag.OrderId"></select>
</div>
<script>
$("#my_select").change(function () {
var id = $(this).children(":selected").attr("value");
var array = #Html.Raw(Json.Serialize(ViewData["Orders"]));
for (var i = 0; i < array.length; i++) {
if(array[i].id == parseInt(id))
{
console.log("Coin.Name:"+array[i].coin.name);
console.log("Amount:" + array[i].amount);
}
}
});
</script>
Test Result:
Is this what you want?