需要一个示例,说明如何在不使用 MVC 和 EF 的情况下在相同 Razor 页面版本 .NET Core 6 或 7 中填充级联下拉列表,请仅通过使用 MVC 或/和 EF 找到。
我能够在同一个 razor 页面(不是级联)中填充一个或多个 DDL,使用 DAPPER,没有 MVC 也没有 EF。
我正在使用 Dapper 而不是 EF,只在一个页面中填充每个 DDL,不需要创建/编辑/删除视图,我需要它非常简单、整洁和方便。我的代码现在没有显示任何错误,但也没有用任何数据填充第二个 DDL。
Here screenshot where 1 is the DropDownList Country "Pais" (PaisR), end 2 is the DropDownList on cascade City "Ciudad" (CiudadR)
[Razor Page Solicitud][1]
我的模型,不是全部,只有涉及的模型
public class Solicitud
{
public int IdSolicitud { get; set; }
public int IdEmpleado { get; set; }
[Required, StringLength(50)]
public string? Nombre { get; set; }
[Required, StringLength(50)]
public string? Apellido { get; set; }
[Required, StringLength(1)]
public string? TipoIdentidad { get; set; }
[Required, StringLength(50)]
public string? Identidad { get; set; }
[Required]
public DateTime FechaSolicitud { get; set; }
[Required]
public DateTime FechaNacimiento { get; set; }
public string? Sexo { get; set; }
public string? EstadoCivil { get; set; }
public string? Telefono { get; set; }
public string? Correo { get; set; }
public int IDPaisNacimiento { get; set; }
public virtual PaisN? PaisesN { get; set; }
public int IDPaisResidencia { get; set; }
public virtual PaisR? PaisesR { get; set; }
public int IDCiudadResidencia { get; set; }
public virtual CiudadR? CiudadesR { get; set; }
public string? DireccionResidencia { get; set; }
}
public class CiudadR
{
public int IDCiudadResidencia { get; set; }
public string? descCiudadResidencia { get; set; }
public int? IDPaisR { get; set; }
public PaisR? DescPaisesR { get; set; }
}
public class PaisR
{
public int IDPaisResidencia { get; set; }
public string? descPaisResidencia { get; set; }
}
我的存储库 IPaisRRepo
public interface IPaisRRepo
{
List<PaisR> ListarPaisesR();
}
public class PaisRRepo: IPaisRRepo
{
private IConfiguration _configuration;
private string _connection { get { return _configuration.GetConnectionString("mysqldbhr"); } }
public PaisRRepo(IConfiguration configuration)
{
_configuration = configuration;
}
public List<PaisR> ListarPaisesR()
{
using (var connection = new MySqlConnection(_connection))
{
return (List<PaisR>)connection.Query<PaisR>("Select idpais idpaisresidencia, descpais descpaisresidencia FROM paises");
}
}
}
存储库 CiudadRRepo
public interface ICiudadRRepo
{
List<CiudadR> ListarCiudadesR(int idPaisR);
}
public class CiudadRRepo : ICiudadRRepo
{
private IConfiguration _configuration;
private string _connection { get { return _configuration.GetConnectionString("mysqldbhr"); } }
public CiudadRRepo(IConfiguration configuration)
{
_configuration = configuration;
}
public List<CiudadR> ListarCiudadesR(int idciudadR)
{
using (var connection = new MySqlConnection(_connection))
{
return (List<CiudadR>)connection.Query<CiudadR>("Select idciudad idciudadresidencia, descciudad descciudadresidencia FROM ciudades WHERE Idciudad=@idciudadR",
new { idciudadR = idciudadR }
);
}
}
}
主页的存储库,SolicitudRepo
using ASHEHR.Models;
using Dapper;
using MySqlConnector;
using System.Data;
using System.Dynamic;
namespace ASHEHR.Repository
{
public interface ISolicitudRepo
{
IEnumerable<Solicitud> Listar();
string Salvar(Solicitud solicitud);
void Eliminar(int idSolicitud);
}
public class SolicitudRepo : ISolicitudRepo
{
private IConfiguration _configuration;
private string _connection { get { return _configuration.GetConnectionString("mysqldbhr"); } }
public SolicitudRepo(IConfiguration configuration)
{
_configuration = configuration;
}
public IEnumerable<Solicitud> Listar()
{
using (var connection = new MySqlConnection(_connection))
{
return connection.Query<Solicitud>("Select IdSolicitud, IdEmpleado, Nombre, Apellido, TipoIdentidad, Identidad, FechaSolicitud, FechaNacimiento, Sexo " +
" , EstadoCivil, Telefono, Correo, IDPaisNacimiento, IDPaisResidencia, IDCiudadResidencia, DireccionResidencia FROM Solicitudes");
}
}
public string Salvar(Solicitud solicitud)
{
var mensaje = "";
using (var connection = new MySqlConnection(_connection))
{
var p = new DynamicParameters();
p.Add("p_IdSolicitud", solicitud.IdSolicitud);
p.Add("p_IdEmpleado", solicitud.IdEmpleado);
p.Add("p_Nombre", solicitud.Nombre);
p.Add("p_Apellido", solicitud.Apellido);
p.Add("p_TipoIdentidad", solicitud.TipoIdentidad);
p.Add("p_Identidad", solicitud.Identidad);
p.Add("p_FechaSolicitud", solicitud.FechaSolicitud);
p.Add("p_FechaNacimiento", solicitud.FechaNacimiento);
p.Add("p_Sexo", solicitud.Sexo);
p.Add("p_EstadoCivil", solicitud.EstadoCivil);
p.Add("p_Telefono", solicitud.Telefono);
p.Add("p_Correo", solicitud.Correo);
p.Add("p_IDPaisNacimiento", solicitud.IDPaisNacimiento);
p.Add("p_IDPaisResidencia", solicitud.IDPaisResidencia);
p.Add("p_IDCiudadResidencia", solicitud.IDCiudadResidencia);
p.Add("p_DireccionResidencia", solicitud.DireccionResidencia);
p.Add("p_response", dbType: DbType.String, direction: ParameterDirection.Output, size:100);
connection.Execute("sp_sol_iu1", p, commandType: CommandType.StoredProcedure);
mensaje = p.Get<string>("p_response");
}
return mensaje;
}
public void Eliminar(int idSolicitud)
{
using (var connection = new MySqlConnection(_connection))
{
connection.Execute("DELETE FROM solicitudes WHERE IdSolicitud=@IdSolicitud ", new
{
IdSolicitud = idSolicitud
});
}
}
}
}
这是我主页的后端,Solicitud
using ASHEHR.Models;
using ASHEHR.Repository;
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
using SelectList = Microsoft.AspNetCore.Mvc.Rendering.SelectList;
namespace ASHEHR.Pages
{
public class SolicitudModel : PageModel
{
private readonly ILogger<SolicitudModel> _logger;
public IEnumerable<Solicitud>? Solicitudes { get; set; }
private readonly ISolicitudRepo _rep;
private readonly IPaisNRepo _paisnrepo;
private readonly IPaisRRepo _paisrrepo;
private readonly ICiudadRRepo _ciudadrrepo;
public string? Mensaje { get; set; }
[BindProperty]
public Solicitud? solicitud { get; set; }
public SelectList? PaisesN { get; set; }
public SelectList? PaisesR { get; set; }
public SelectList? CiudadesR { get; set; }
public SolicitudModel(ILogger<SolicitudModel> logger, ISolicitudRepo rep, IPaisNRepo paisnrepo, IPaisRRepo paisrrepo, ICiudadRRepo ciudadRRepo)
{
_logger = logger;
_rep = rep;
_paisnrepo = paisnrepo;
_paisrrepo = paisrrepo;
_ciudadrrepo = ciudadRRepo;
}
public async Task<IActionResult> OnGet()
{
await LoadInitialData();
return Page();
}
public async Task<IActionResult> OnPostAsync(Solicitud solicitud)
{
string mOpcion2 = Request.Form["txtOpcion"];
if (mOpcion2 == "D")
{
_rep.Eliminar(solicitud.IdSolicitud);
Mensaje = "Registro eliminado!";
}
if (!ModelState.IsValid)
{
Mensaje = "Operacion fallida!";
TempData["Mensaje"] = Mensaje;
//return RedirectToPage("Solicitud");
await LoadInitialData();
return Page();
}
try
{
if (mOpcion2 != "D")
{
Mensaje = _rep.Salvar(solicitud);
}
}
catch (Exception ex)
{
_logger.LogError(ex, "Solicitud");
Mensaje = ex.Message;
}
TempData["Mensaje"] = Mensaje;
await LoadInitialData();
return Page();
//return RedirectToPage("Solicitud");
}
private Task LoadInitialData()
{
_logger.LogInformation("Buscando Datos");
Solicitudes = _rep.Listar();
PaisesN = new SelectList( _paisnrepo.ListarPaisesN().ToList(),"IDPaisNacimiento","descPaisNacimiento");
PaisesR = new SelectList( _paisrrepo.ListarPaisesR().ToList(), "IDPaisResidencia", "descPaisResidencia");
return Task.CompletedTask;
}
}
}
前端
@page
@addTagHelper*, Microsoft.AspNetCore.Mvc.TagHelpers
@model ASHEHR.Pages.SolicitudModel
@{
}
<div class="container">
<form method="post" >
@Html.AntiForgeryToken()
<div class="card shadow-lg border-1 rounded-lg mt-2">
<div class="card-header m-1 p-1 h-50">
<div class="col-md-12 m-0 p-0">
<asp:Label runat="server" ID="lblTitulo" Text="Solicitudes"></asp:Label>
<asp:Label runat="server" ID="lblOpcion" Visible="true"></asp:Label>
<input type="text" id="txtOpcion" name="txtOpcion" />
</div>
</div>
<div class="card-body m-1 p-1">
<div class="mx-auto mt-1">
<div class="form-group">
<div class="row">
<div class="col-1 m-0 ">
<label for="IdSolicitud" class="col-form-label-sm">IdSol</label>
<input type="text" class="form-control form-control-sm" name="IdSolicitud" id="IdSolicitud" Font-Size="Small" value="0" readonly /> @* type="hidden" *@
</div>
<div class="col-1 m-0 ">
<label for="IdEmpleado" class="col-form-label-sm">IdEmp</label>
<input type="text" class="form-control form-control-sm" name="IdEmpleado" id="IdEmpleado" Font-Size="Small" value="0" readonly />
</div>
<div class="col-2 m-0">
<label for="Nombre" class="col-form-label-sm">Nombre</label>
<input type="text" class="form-control form-control-sm" name="Nombre" id="Nombre" Font-Size="Small" />
</div>
<div class="col-2 m-0">
<label for="Apellido" class="col-form-label-sm">Apellido</label>
<input type="text" class="form-control form-control-sm" name="Apellido" id="Apellido" Font-Size="Small" />
</div>
<div class="col-1 m-0">
<label for="TipoIdentidad" class="col-form-label-sm">Tipo Id</label>
<select id="TipoIdentidad" name="TipoIdentidad" class="form-control form-control-sm">
<option value="C" selected="selected">Cedula</option>
<option value="P" >Pasaporte</option>
<option value="R" >Residencia</option>
<option value="T" >Temporal</option>
</select>
</div>
<div class="col-2 m-0">
<label for="Identidad" class="col-form-label-sm">Identidad</label>
<input type="text" class="form-control form-control-sm" name="Identidad" id="Identidad" data-val="true" data-val-required="Campo requerido." />
</div>
<div class="col-1 m-0">
<label for="Sexo" class="col-form-label-sm">Sexo</label>
<select id="Sexo" name="Sexo" class="form-control form-control-sm">
<option value="F" selected="selected">Femenino</option>
<option value="M">Masculino</option>
</select>
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-2 m-0">
<label for="FechaSolicitud" class="col-form-label-sm">FechaSolicitud</label>
<input type="date" class="form-control form-control-sm" name="FechaSolicitud" id="FechaSolicitud" Font-Size="Small" />
</div>
<div class="col-2 m-0">
<label for="FechaNacimiento" class="col-form-label-sm">FechaNacimiento</label>
<input type="date" class="form-control form-control-sm" name="FechaNacimiento" id="FechaNacimiento" Font-Size="Small" />
</div>
<div class="col-1 m-0">
<label for="EstadoCivil" class="col-form-label-sm">EstCivil</label>
<select id="EstadoCivil" name="EstadoCivil" class="form-control form-control-sm">
<option value="S" selected="selected">Soltero(a)</option>
<option value="C">Casado(a)</option>
<option value="U">UnionLibre</option>
</select>
</div>
<div class="col-1 m-0">
<label for="Telefono" class="col-form-label-sm">Telefono</label>
<input type="text" class="form-control form-control-sm" name="Telefono" id="Telefono" Font-Size="Small" />
</div>
<div class="col-2 m-0">
<label for="Correo" class="col-form-label-sm">Correo</label>
<input type="text" class="form-control form-control-sm" name="Correo" id="Correo" Font-Size="Small" />
</div>
<div class="col-2 m-0">
<label asp-for="solicitud.IDPaisNacimiento" class="control-label">Pais Nacio</label>
<select class="form-control form-control-sm" asp-for="solicitud.IDPaisNacimiento" asp-items="Model.PaisesN" name="IDPaisNacimiento" id="IDPaisNacimiento"></select>
</div>
<div class="col-2 m-0">
<label asp-for="solicitud.IDPaisResidencia" class="control-label">Pais Reside</label>
<select class="form-control form-control-sm" asp-for="solicitud.IDPaisResidencia" asp-items="Model.PaisesR" name="IDPaisResidencia" id="IDPaisResidencia"></select>
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-2 m-0">
<label asp-for="solicitud.IDCiudadResidencia" class="control-label">CiudadReside</label>
<select class="form-control form-control-sm" asp-for="solicitud.IDCiudadResidencia" asp-items="Model.CiudadesR" name="IDCiudadResidencia" id="IDCiudadResidencia"></select>
</div>
<div class="col-3 m-0">
<label for="DireccionResidencia" class="col-form-label-sm">Direccion</label>
<input type="text" class="form-control form-control-sm" name="DireccionResidencia" id="DireccionResidencia" Font-Size="Small" />
</div>
</div>
</div>
<div class="form-group">
<div class="row align-items-center justify-content-center">
<div class="col-sm-auto">
<p></p>
<input type="submit" value="Salvar" class="btn btn-success btn-sm" />
</div>
<div class="col-sm-auto">
@{ <h6 class="bg-warning">@TempData["Mensaje"]</h6> }
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
@if (Model != null && Model.Solicitudes.Any())
{
<table class="table">
<thead>
<tr>
<th scope="col" style="display:none">IdSol</th>
<th scope="col">IDEmp</th>
<th scope="col">Nombre</th>
<th scope="col">Apellido</th>
<th scope="col" style="display:none">TipoID</th>
<th scope="col">Identidad</th>
<th scope="col">FechaSolicitud</th>
<th scope="col" style="display:none">FechaNacimiento</th>
<th scope="col">Sexo</th>
<th scope="col" style="display:none">EstCivil</th>
<th scope="col" style="display:none">Telefono</th>
<th scope="col" style="display:none">Correo</th>
<th scope="col" style="display:none">IDPaisNac</th>
<th scope="col" style="display:none">IDPaisRes</th>
<th scope="col" style="display:none">IDCiudadRes</th>
<th scope="col" style="display:none">DireccionRes</th>
</tr>
</thead>
<tbody>
@foreach (var item in Model.Solicitudes)
{
<tr>
<td scope="row" style="display:none">@item.IdSolicitud</td>
<td scope="row">@item.IdEmpleado</td>
<td scope="row">@item.Nombre</td>
<td scope="row">@item.Apellido</td>
<td scope="row" style="display:none">@item.TipoIdentidad</td>
<td scope="row">@item.Identidad</td>
<td scope="row">@item.FechaSolicitud.ToString("yyyy-MM-dd")</td>
<td scope="row" style="display:none">@item.FechaNacimiento.ToString("yyyy-MM-dd")</td>
<td scope="row">@item.Sexo</td>
<td scope="row" style="display:none">@item.EstadoCivil</td>
<td scope="row" style="display:none">@item.Telefono</td>
<td scope="row" style="display:none">@item.Correo</td>
<td scope="row" style="display:none">@item.IDPaisNacimiento</td>
<td scope="row" style="display:none">@item.IDPaisResidencia</td>
<td scope="row" style="display:none" >@item.IDCiudadResidencia</td>
<td scope="row" style="display:none">@item.DireccionResidencia</td>
<td>
<div class="btn-group btn-group-sm">
<button type="submit" value="Eliminar" onclick="LlenaRecord('@item.IdSolicitud',
'@item.IdEmpleado',
'@item.Nombre',
'@item.Apellido',
'@item.TipoIdentidad',
'@item.Identidad',
'@item.FechaSolicitud',
'@item.FechaNacimiento',
'@item.Sexo',
'@item.EstadoCivil',
'@item.Telefono',
'@item.Correo',
'@item.IDPaisNacimiento',
'@item.IDPaisResidencia',
'@item.IDCiudadResidencia',
'@item.DireccionResidencia',
'D',
);" class="btn btn-danger">
<i class="fas fa-trash-alt"></i>
</button>
<a onclick="LlenaRecord('@item.IdSolicitud',
'@item.IdEmpleado',
'@item.Nombre',
'@item.Apellido',
'@item.TipoIdentidad',
'@item.Identidad',
'@item.FechaSolicitud',
'@item.FechaNacimiento',
'@item.Sexo',
'@item.EstadoCivil',
'@item.Telefono',
'@item.Correo',
'@item.IDPaisNacimiento',
'@item.IDPaisResidencia',
'@item.IDCiudadResidencia',
'@item.DireccionResidencia',
'I',
); " class="btn btn-warning"><i class="fas fa-pencil-alt"></i></a>
</div>
</td>
</tr>
}
</tbody>
</table>
}
</div>
</form>
</div>
我的剧本
function LlenaRecord(IdSolicitud, IdEmpleado, Nombre,Apellido,TipoIdentidad, Identidad, FechaSolicitud, FechaNacimiento, Sexo, EstadoCivil, Telefono, Correo, IDPaisNacimiento, IDPaisResidencia, IDCiudadResidencia, DireccionResidencia ,Opcion)
{ var response = true;
if (Opcion=='D'){
var response = confirm("Confirmar?");
}
var dateS = new Date(FechaSolicitud).toISOString().split('T')[0];
var dateN = new Date(FechaNacimiento).toISOString().split('T')[0];
if (response){
$('#IdSolicitud').val(IdSolicitud);
$('#IdEmpleado').val(IdEmpleado);
$('#Nombre').val(Nombre);
$('#Apellido').val(Apellido);
$('#TipoIdentidad').val(TipoIdentidad);
$('#Identidad').val(Identidad);
$('#FechaSolicitud').val(dateS);
$('#FechaNacimiento').val(dateN);
$('#Sexo').val(Sexo);
$('#EstadoCivil').val(EstadoCivil);
$('#Telefono').val(Telefono);
$('#Correo').val(Correo);
$('#IDPaisNacimiento').val(IDPaisNacimiento);
$('#IDPaisResidencia').val(IDPaisResidencia);
$('#IDCiudadResidencia').val(IDCiudadResidencia);
$('#DireccionResidencia').val(DireccionResidencia);
$('#txtOpcion').val(Opcion);
}
}
[1]: https://i.stack.imgur.com/UymSZ.png