asp.net-mvc - net - mostrar datos de una tabla en mvc
ASP.NET MVC: utiliza el mismo formulario para crear y editar (10)
¿Cuál es el enfoque de mejores prácticas para crear un formulario que se utiliza tanto para crear nuevos modelos y editar modelos existentes?
¿Hay algún tutorial al que la gente pueda dirigirme?
No use la misma acción de controlador . Nuevo = HTTP PUT; edit = HTTP POST, por lo que son dos cosas diferentes. Ambas acciones pueden y deben estar en el mismo controlador, sin embargo.
Me gusta la idea de utilizar un control de usuario para las funciones comunes (por ejemplo, editores), y envolver eso en vistas específicas de acción para cosas que solo deberían aparecer en nuevas o editar, pero no en ambas.
Podría ser (debería ser IMO) un controlador pero diferentes acciones del controlador. También asegúrese de tener los verbos HTTP apropiados asociados con la acción apropiada. ¡Sigue el tutorial publicado por E Rolnicki y estarás en camino!
Happy Coding !!
Puse el formulario en un control de usuario, por ejemplo, Views / Shared / WidgetForm.ascx. Puse todos los campos de formulario en este control de usuario, pero NO las etiquetas de formulario.
Las vistas, por ejemplo Views / Widgets / New.aspx y Views / Widgets / Edit.aspx, tienen las etiquetas de formulario en ellas y todos los "alrededores" - instrucciones para completar el formulario, el título de la página, etc. etc. Luego incluyen el control de usuario dentro de las etiquetas de formulario.
El control de usuario simplemente toma un objeto Widget y muestra un formulario basado en los resultados. Poner los valores predeterminados razonables en las nuevas opciones de widgets, por lo tanto, se vuelve importante, pero de todos modos lo estás haciendo, ¿no? ;)
Si la entidad tiene algún tipo de clave privada interna (por ejemplo, un miembro "id" que siempre es> 0), puede usar / Edit / 0 en lugar de / Create
Tengo un sistema que creo que funciona bastante bien. En mis vistas compartidas, tengo 2 formas genéricas, Edit.aspx y New.aspx
Luego, en mi carpeta de vista específica, tengo un control llamado EditItems.ascx
En mi formulario de edición, tengo las etiquetas de formulario y botones específicos para editar y en el formulario nuevo tengo las etiquetas de formulario y botones específicos para las nuevas. En cada uno tengo Html.RenderPartial ("EditItems.ascx")
De esta forma, su control de usuario puede estar fuertemente tipado y, sin embargo, está reutilizando la apariencia de la edición y las páginas nuevas.
Ahora, en algunos casos, su nueva página puede tener un diseño diferente al de la página Editar. En ese caso, simplemente agregue "Edit.aspx" a su carpeta de vista específica.
Encuentro que esto me da la mejor combinación de reutilización y, al mismo tiempo, me permite la personalización total si la necesito. Y en cuanto a las acciones del controlador, sí deberían ser acciones separadas.
Yo uso algo como
[HttpGet]
public ActionResult EntityEdit(Guid id)
{
return View();
}
y
[HttpGet]
public ActionResult EntityCreate()
{
return View("EntityEdit");
}
Eso parece funcionar bien.
esta no es siempre la mejor práctica porque depende del caso, así es como lo hice
1 / i combiné las acciones del controlador para crear y editar
public PartialViewResult Creedit(string id = null)
{
if (id == null)
{
// Create new record (this is the view in Create mode)
return PartialView();
}
else
{
// Edit record (view in Edit mode)
Client x = db.ClientSet.Find(id);
if (x == null) { return PartialView("_error"); }
// ...
return PartialView(x);
}
}
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Creedit(Client x)
{
if (x.id == null)
{
// insert new record
}
else
{
// update record
}
}
2 / i combiné la edición y creación de vistas en una vista que llamo Creedit
// if you need to display something unique to a create view
// just check if the Model is null
@if(Model==null){
}
entonces tengo 1 vista y 2 acciones (1 publicación y 1 obtención) en lugar de 2 vistas y 4 acciones.
NerdDinner realmente mostrará el camino.
Create.aspx
<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<NerdDinner.Models.Dinner>" MasterPageFile="~/Views/Shared/Site.Master" %>
<asp:Content ID="Title" ContentPlaceHolderID="TitleContent" runat="server">
Host a Nerd Dinner
</asp:Content>
<asp:Content ID="Create" ContentPlaceHolderID="MainContent" runat="server">
<h2>Host a Dinner</h2>
<% Html.RenderPartial("DinnerForm"); %>
</asp:Content>
Edit.aspx
<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<NerdDinner.Models.Dinner>"
MasterPageFile="~/Views/Shared/Site.Master" %>
<asp:Content ID="Title" ContentPlaceHolderID="TitleContent" runat="server">
Edit: <%:Model.Title %>
</asp:Content>
<asp:Content ID="Edit" ContentPlaceHolderID="MainContent" runat="server">
<h2>Edit Dinner</h2>
<% Html.RenderPartial("DinnerForm"); %>
</asp:Content>
DinnerForm.ascx
<%@ Language="C#" Inherits="System.Web.Mvc.ViewUserControl<NerdDinner.Models.Dinner>" %>
<script src="/Scripts/MicrosoftAjax.js" type="text/javascript"></script>
<script src="/Scripts/MicrosoftMvcAjax.js" type="text/javascript"></script>
<script src="/Scripts/MicrosoftMvcValidation.js" type="text/javascript"></script>
<% Html.EnableClientValidation(); %>
<%: Html.ValidationSummary("Please correct the errors and try again.") %>
<% using (Html.BeginForm())
{ %>
<fieldset>
<div id="dinnerDiv">
<%:Html.EditorForModel() %>
<p>
<input type="submit" value="Save" />
</p>
</div>
<div id="mapDiv">
<%: Html.EditorFor(m => m.Location) %>
</div>
</fieldset>
<% } %>
Tenga en cuenta que este formulario utiliza Html.EditorForModel() , que es un método innovador para generar todos los campos a la vez, y debe estudiar sus desventajas antes de usarlo. Pero puede tomar fácilmente el resto del ejemplo para separar su forma común de las vistas de creación y edición.
Finalmente, puede ver el código del controlador aquí si está interesado.
Suposiciones
Esto es bueno para que el usuario vea diferentes URL para diferentes acciones en el navegador. Por ejemplo ''/ pages / create'' y ''/ pages / edit / 1''.
Esto es bueno para que el desarrollador tenga solo un par de acción + vista para crear y editar páginas, ya que suelen ser muy similares. (Además, es bueno tener un controlador por entidad).
Solución
El registro predeterminado de rutas es ''{controller} / {action} / {id}''. Podemos agregar dos reglas más antes de esta:
{controller} / create (debe apuntar a la acción ''CreateOrEdit'')
{controller} / edit / {id} (debe apuntar a la acción ''CreateOrEdit'' también)
Ahora podemos tener algo como esto:
public static void RegisterRoutes(RouteCollection routes)
{
routes.MapRoute(
name: "Create",
url: "{controller}/create",
defaults: new { controller = "Default", action = "CreateOrEdit" }
);
routes.MapRoute(
name: "Edit",
url: "{controller}/edit/{id}",
defaults: new { controller = "Default", action = "CreateOrEdit" }
);
routes.MapRoute(
name: "Default",
url: "{controller}/{action}/{id}",
defaults: new { controller = "Default", action = "Index", id = UrlParameter.Optional }
);
}
Por lo tanto, ahora las solicitudes de creación y edición serán manejadas por la acción ''CreateOrEdit''. Otros irán de la manera predeterminada.
A continuación, lo que debemos hacer es agregar la acción ''CreateOrEdit'' para HttpGet y HttpPost en nuestro controlador:
[HttpGet]
public ActionResult CreateOrEdit(int? id)
{
return this.View(new CreateOrEditViewModelBuilder(this).Build(id));
}
[HttpPost]
public ActionResult CreateOrEdit(CreateOrEditViewModel сreateOrEditViewModel)
{
if (this.ModelState.IsValid)
{
Page page = new CreateOrEditViewModelMapper(this).Map(сreateOrEditViewModel);
if (сreateOrEditViewModel.Id == null)
this.UnitOfWork.GetRepository<IPageRepository>().Create(page);
else this.UnitOfWork.GetRepository<IPageRepository>().Edit(page);
this.UnitOfWork.Save();
return this.RedirectToAction("Index");
}
return this.View(сreateOrEditViewModel);
}
Y el último tenemos que agregar una vista llamada ''CreateOrEdit''. Podemos usar ''this.Model.Id == null'' para saber si creamos o editamos.
Resultado
Ahora no tenemos código duplicado y podemos tener URL obvias como esta:
/ páginas (para ver todas las páginas)
/ pages / create (para crear una página nueva)
/ pages / edit / 1 (para editar la página existente)
/ pages / delete / 1 (para eliminar la página existente)
¡Espero que ayude a alguien!