Mostrar datos de la base de datos SQL en Gridview

Question

Quiero mostrar los datos en la vista de cuadrícula usando 3 tablas en la base de datos SQL.

primero creé Modelo

public class common 
    { 

     public Artist Artist { get; set; } 
     public Album Album { get; set; } 
     public Genre Genre { get; set; } 

    } 

entonces este es el controlador

public ActionResult Show1() 
    { 
     var query = from a in DB.Album 
        join b in DB.Artists 
        on a.ArtistId equals b.ArtistId 
        join c in DB.Genre 
        on a.GenreId equals c.GenreId 
        where (b.ArtistId == 2) 
        select new common { Album = a, Artist = b, Genre = c }; 
     return View(query.ToList()); 
    } 

} 

Después de que este es mi punto de vista

@model IEnumerable<test1.Models.common> 


@{ 
    ViewBag.Title = "Show1"; 
} 

<h2>Show1</h2> 

<div> 

@{ 

    var grid = new WebGrid(Model, defaultSort:"Name"); 

} 

@grid.GetHtml() 

</div> 

Pero no muestra ningún dato? ¿Cómo puedo hacerlo?

Answer 1

Creo que se necesita un editorTemplate para su modelo de objeto común o para utilizar una frase y rellenar una tabla HTML

por ejemplo ...

<table summary=""> 
    <thead> 
     <tr> 
      <th></th> 
      <th> 
       Account No. 
      </th> 
      <th> 
       Customer Name 
      </th> 
      <th class="SingleCheckBox"> 
       Is Approved 
      </th> 
      <th class="SingleCheckBox"> 
       Is Locked out 
      </th> 
      <th> 
       Last Login 
      </th> 
     </tr> 
    </thead> 
    <tbody> 
@for (int i = 0; i < Model.Count(); ++i) 
{ 
    var item = Model[i]; 
    bool isSelected = item.AccountNo == selectedAccountNo; 
    <tr> 
     <td>@Html.RadioButton("selectedUserName", item.UserName, isSelected, new { name = "selectedUserName" })</td> 
     <td> 
      @Html.DisplayFor(model => model[i].UserName) 
      @Html.HiddenFor(model => model[i].UserName) 
     </td> 
     <td> 
      @Html.DisplayFor(modelItem => item.Email) 
     </td> 
     <td class="SingleCheckBox"> 
      @Html.CheckBoxFor(model => model[i].IsApproved) 
     </td> 
     <td class="SingleCheckBox"> 
      @if (item.IsLockedOut) 
      { 
       @Html.CheckBoxFor(model => model[i].IsLockedOut); 
      } 
      else 
      { 
       @Html.CheckBoxFor(model => model[i].IsLockedOut); 
      } 
     </td> 
     <td class="last-child"> 
      @(TimeZoneInfo.ConvertTime(DateTime.SpecifyKind(item.LastLoginDate, DateTimeKind.Utc), timeZoneInfo).ToString()) 
     </td> 
    </tr> 
} 
    </tbody> 
</table> 

Answer 2

creo que la mejor respuesta a su pregunta es otra pregunta: "¿Por qué un WebGrid?"

Si se refiere a la funcionalidad por defecto de un nuevo cr eated MVC project, verá que Index.cshtml usará una tabla (como se sugiere en la respuesta proporcionada por @hagensoft). Según mi experiencia, cuando los elementos están correctamente armados para un proyecto de MVC en Visual Studio, he tenido que trabajar muy poco para conseguir que la lista de modelos se muestre bien, incluso paginada si es necesario.

Para hacer un mejor uso de la paginación, si eso es lo que está buscando, he hecho un gran uso del paquete PagedList.MVC disponible a través de NuGet (https://www.nuget.org/packages/PagedList.Mvc/). Existe una gran cantidad de documentación relacionada con la funcionalidad proporcionada por PagedList, y PagedList, junto con la sugerencia de tabla/comportamiento de vista predeterminado con nuevos proyectos MVC en Visual Studio, funciona de maravilla junto con cualquier clasificación, búsqueda o funcionalidad similar que desee. para proporcionar dentro de su aplicación.

Un fantástico tutorial que me refiero sobre clasificación, filtrado y paginación se puede encontrar aquí: https://docs.microsoft.com/en-us/aspnet/mvc/overview/getting-started/getting-started-with-ef-using-mvc/sorting-filtering-and-paging-with-the-entity-framework-in-an-asp-net-mvc-application

Si usted es insistente sobre el uso de un WebGrid/GridView, sugeriría quizás mover la llamada base de datos fuera de la controlador y directamente en la vista de Razor, o intente enviar un ObervableCollection <>, no una lista <>, de un ViewModel dedicado del controlador.

La moraleja de la historia aquí es no aventurarse lejos del camino proporcionado. Intente utilizar las herramientas que se le otorgan y siga el formato predeterminado para los proyectos de MVC.

Answer 3

primero Añadir Jquery en su opinión

<script src="../../Scripts/jquery-1.7.1.min.js" type="text/javascript"></script> 

Si desea labrar encuentra el

<style type="text/css"> 
      .webGrid { margin: 4px; border-collapse: collapse; width: 500px; background-color:#FCFCFC;} 
      .header { background-color: #C1D4E6; font-weight: bold; color: #FFF; } 
      .webGrid th, .webGrid td { border: 1px solid #C0C0C0; padding: 5px; } 
      .alt { background-color: #E4E9F5; color: #000; } 
      .gridHead a:hover {text-decoration:underline;} 
      .description { width:auto} 
      .select{background-color: #389DF5} 
     </style> 

Añadir Modelo en su opinión

@{ 
     test1.Models.common Common = new test1.Models.common(); 
    } 

Agregar código en su opinión

@{ 
    var grid = new WebGrid(Model, canPage: true, rowsPerPage: 5, selectionFieldName: "selectedRow",ajaxUpdateContainerId: "gridContent"); 
      grid.Pager(WebGridPagerModes.NextPrevious);} 
      <div id="gridContent"> 
      @grid.GetHtml(tableStyle: "webGrid", 
        headerStyle: "header", 
        alternatingRowStyle: "alt", 
        selectedRowStyle: "select", 
        columns: grid.Columns(
        grid.Column("Id", "Id"), 
        grid.Column("Name", "Name"), 
        grid.Column("Description", "Description"), 

      )) 
     @if (grid.HasSelection) 
      { 
       common= (test1.Models.common)grid.Rows[grid.SelectedIndex].Value; 
       <b>Id</b> @common.Artist.Id<br /> 
       <b>Name</b> @common.Album.Name<br /> 
       <b>Description</b> @common.Album.Description<br /> 

      } 
    </div> 

Editar esta sección De acuerdo con datos de tu modelo

@if (grid.HasSelection) 
     { 
      common= (test1.Models.common)grid.Rows[grid.SelectedIndex].Value; 
      <b>Id</b> @common.Artist.Id<br /> 
      <b>Name</b> @common.Album.Name<br /> 
      <b>Description</b> @common.Album.Description<br /> 

     }