Usuário com melhor resposta
Como editar uma imagem

Pergunta
-
Olá,
Como retornar a imagem gravada na tabela abaixo em um banco SQL Server?
id int Unchecked filename nvarchar(50) Checked type nchar(10) Checked ext nchar(10) Checked nome nvarchar(50) Checked imagem image Checked tipo nvarchar(50) Checked No controler eu tenho a linha:
ViewBag.cod_Foto = new SelectList(db.Foto, "id", "imagem", animal_companhia.cod_Foto);
No View edit:
<img src="@Model.Foto" border="0"/>
Ao editar um registro com uma imagem no código fonte aparece a linha abaixo:
<img src="System.Data.Entity.DynamicProxies.Foto_18FF6A971E4E92CC9D248BE834636D4DF012EE80FDAB9D00457BB90AFCF0CF8F" border="0"/>
Alguém tem alguma sugestão?
Respostas
-
Wilson,
Perceba que você não tem nenhum campo com a "Imagem" da foto mesmo, possui apenas o código.
Nesse caso, você teria que criar uma ViewModel para personalizar, onde a mesma contenha todos as propriedades dessa sua classe "Animal_Companhia" e mais uma propriedade que seria essa:
public byte[] imagem { get; set; }
O valor dessa propriedade você iria buscar na sua classe Foto, através do ID que você já tem.
Aí ao invés de passar para a sua View um objeto do tipo "Animal_Companhia" você passaria sua ViewModel (por exemplo (Animal_CompanhiaViewModel)
Após isso, na View você terá uma propriedade "Model.imagem" do tipo byte[] para usar no código que te passei. Esse aqui:
@{ var base64 = Convert.ToBase64String(Model.imagem); var imgSrc = String.Format("data:image/gif;base64,{0}", base64); } <img src='@imgSrc' style="max-width:100px; max-height:100px;" />
Não sei você já trabalhou com ViewModels, mas na web tem várias referências sobre.
Valeu!
- Marcado como Resposta Wilson Boris quinta-feira, 21 de julho de 2016 16:39
-
Altere para isso:
@{ var base64 = Convert.ToBase64String(item.imagem); var imgSrc = String.Format("data:image/gif;base64,{0}", base64); } <img src='@imgSrc' style="max-width:100px; max-height:100px;" />
- Marcado como Resposta Wilson Boris quinta-feira, 21 de julho de 2016 16:39
Todas as Respostas
-
Olá Wilson,
Tenta fazer dessa forma na sua View:
@{ var base64 = Convert.ToBase64String(model.Foto); var imgSrc = String.Format("data:image/gif;base64,{0}", base64); } <img src='@imgSrc' style="max-width:100px; max-height:100px;" />
Valeu!- Editado André SeccoMVP quarta-feira, 20 de julho de 2016 19:02
-
-
-
-
-
namespace OG.Models
{
using System;
using System.Collections.Generic;
public partial class Foto
{
public Foto()
{
this.Animal_Companhia = new HashSet<Animal_Companhia>();
}
public int id { get; set; }
public string filename { get; set; }
public string type { get; set; }
public string ext { get; set; }
public string nome { get; set; }
public byte[] imagem { get; set; }
public string tipo { get; set; }
public virtual ICollection<Animal_Companhia> Animal_Companhia { get; set; }
}
} -
A propriedade que representa sua imagem no banco tem o nome "imagem" então faz assim:
@{ var base64 = Convert.ToBase64String(Model.imagem); var imgSrc = String.Format("data:image/gif;base64,{0}", base64); } <img src='@imgSrc' style="max-width:100px; max-height:100px;" />
OBS: Estou assumindo que você está tipando sua View com a seguinte linha no inicio do arquivo:
@model OG.Models.Foto
Retorna caso dê certo ou marque como resposta.
Valeu!
- Editado André SeccoMVP quarta-feira, 20 de julho de 2016 19:55
-
Caro André, ainda não!
a imagem fica grifada com o erro abaixo:
Error 6 'OG.Models.Animal_Companhia' does not contain a definition for 'imagem' and no extension method 'imagem' accepting a first argument of type 'OG.Models.Animal_Companhia' could be found (are you missing a using directive or an assembly reference?) d:\Documents\Visual Studio 2013\Projects\OG\G\Views\AnimalCompanhia_\Edit.cshtml 66 47 OG
-
André,
A View que me refiro é um form Edit da "@model OG.Models.Animal_Companhia"
Na tabela Animal_Companhia eu tenho uma chave estrangeira "cod_Foto":
id int Unchecked cod_Foto int Checked data_Cadastro date Checked nome nvarchar(50) Checked cod_Sexo int Checked data_Nasc date Checked cod_Especie_Comp int Checked cod_Raca int Checked pelagem nvarchar(50) Checked id_Microchip nvarchar(50) Checked num_CIA int Checked registro_kenel nvarchar(50) Checked pai nvarchar(50) Checked mae nvarchar(50) Checked cod_Castrado int Checked cod_Acesso_Rua int Checked cod_Proprietario int Checked cod_prop_anterior int Checked - Editado Wilson Boris quarta-feira, 20 de julho de 2016 20:08 complemento
-
-
Sim. MVC4 C# database first entity framework
// GET: /AnimalCompanhia_/Edit/5 [PermissoesFiltro(Roles = "Administrador, Profissional")] public ActionResult Edit(int id = 0) { Animal_Companhia animal_companhia = db.Animal_Companhia.Find(id); if (animal_companhia == null) { return HttpNotFound(); } ViewBag.raca_existente = animal_companhia.cod_Raca; ViewBag.cod_Castrado = new SelectList(db.Adm_Sim_Nao, "id", "descricao", animal_companhia.cod_Castrado); ViewBag.cod_Acesso_Rua = new SelectList(db.Adm_Sim_Nao, "id", "descricao", animal_companhia.cod_Acesso_Rua); ViewBag.cod_Especie_Comp = new SelectList(db.Adm_Animal_Comp, "id", "descricao", animal_companhia.cod_Especie_Comp); ViewBag.cod_Raca = new SelectList(db.Adm_Animal_Comp_Raca, "id", "descricao", animal_companhia.cod_Raca); ViewBag.cod_Sexo = new SelectList(db.Adm_Sexo, "id", "descricao", animal_companhia.cod_Sexo); ViewBag.cod_Foto = new SelectList(db.Foto, "id", "imagem", animal_companhia.cod_Foto); ViewBag.cod_Proprietario = new SelectList(db.PF_Proprietario, "id", "nome", animal_companhia.cod_Proprietario); ViewBag.cod_prop_anterior = new SelectList(db.PF_Proprietario, "id", "nome", animal_companhia.cod_Proprietario); return View(animal_companhia); }
@model OG.Models.Animal_Companhia @{ ViewBag.Title = "Edit"; Layout = "~/Views/Shared/_Layout.cshtml"; } @using (Html.BeginForm("Edit", "AnimalCompanhia_", FormMethod.Post, new { @enctype = "multipart/form-data", role = "Form" })) { @Html.AntiForgeryToken() @Html.ValidationSummary(true) ...
- Editado Wilson Boris quarta-feira, 20 de julho de 2016 20:21 complemento
-
Wilson,
Perceba que você não tem nenhum campo com a "Imagem" da foto mesmo, possui apenas o código.
Nesse caso, você teria que criar uma ViewModel para personalizar, onde a mesma contenha todos as propriedades dessa sua classe "Animal_Companhia" e mais uma propriedade que seria essa:
public byte[] imagem { get; set; }
O valor dessa propriedade você iria buscar na sua classe Foto, através do ID que você já tem.
Aí ao invés de passar para a sua View um objeto do tipo "Animal_Companhia" você passaria sua ViewModel (por exemplo (Animal_CompanhiaViewModel)
Após isso, na View você terá uma propriedade "Model.imagem" do tipo byte[] para usar no código que te passei. Esse aqui:
@{ var base64 = Convert.ToBase64String(Model.imagem); var imgSrc = String.Format("data:image/gif;base64,{0}", base64); } <img src='@imgSrc' style="max-width:100px; max-height:100px;" />
Não sei você já trabalhou com ViewModels, mas na web tem várias referências sobre.
Valeu!
- Marcado como Resposta Wilson Boris quinta-feira, 21 de julho de 2016 16:39
-
-
-
Tentando avançar, rsrs
Eu segui o tutorial:
http://tutlane.com/tutorial/aspnet-mvc/how-to-use-viewmodel-in-asp-net-mvc-with-example
Nada feito.
A Index gerada não carrega imagem...
Controller:
public class Animal_ImagemDetailsController : Controller { // // GET: /Animal_ImagemDetails/ [AcceptVerbs(HttpVerbs.Get)] public ActionResult Index() { MED_VetEntities db = new MED_VetEntities(); List<Animal_Imagem> Animal_Imagemlist = new List<Animal_Imagem>(); var animallist = (from Ani in db.Animal_Companhia join Fot in db.Foto on Ani.id equals Fot.id select new { Ani.data_Cadastro, Ani.nome, Ani.cod_Sexo, Ani.data_Nasc, Ani.cod_Especie_Comp, Ani.cod_Raca, Ani.pelagem, Ani.id_Microchip, Ani.num_CIA, Ani.registro_kenel, Ani.pai, Ani.mae, Ani.cod_Castrado, Ani.cod_Acesso_Rua, Ani.cod_Proprietario, Ani.cod_prop_anterior, Fot.imagem }).ToList(); //Ani.cod_Foto, foreach (var item in animallist) { Animal_Imagem objcvm = new Animal_Imagem(); //objcvm.cod_Foto = item.cod_Foto; objcvm.data_Cadastro = item.data_Cadastro; objcvm.nome = item.nome; objcvm.cod_Sexo = item.cod_Sexo; objcvm.data_Nasc = item.data_Nasc; objcvm.cod_Especie_Comp = item.cod_Especie_Comp; objcvm.cod_Raca = item.cod_Raca; objcvm.pelagem = item.pelagem; objcvm.id_Microchip = item.id_Microchip; objcvm.num_CIA = item.num_CIA; objcvm.registro_kenel = item.registro_kenel; objcvm.pai = item.pai; objcvm.mae = item.mae; objcvm.cod_Castrado = item.cod_Castrado; objcvm.cod_Acesso_Rua = item.cod_Acesso_Rua; objcvm.cod_Proprietario = item.cod_Proprietario; objcvm.cod_prop_anterior = item.cod_prop_anterior; objcvm.imagem = item.imagem; Animal_Imagemlist.Add(objcvm); } return View(Animal_Imagemlist); } } }
ViewModels:
public class Animal_Imagem { public Nullable<int> cod_Foto { get; set; } public Nullable<System.DateTime> data_Cadastro { get; set; } public string nome { get; set; } public Nullable<int> cod_Sexo { get; set; } public Nullable<System.DateTime> data_Nasc { get; set; } public Nullable<int> cod_Especie_Comp { get; set; } public Nullable<int> cod_Raca { get; set; } public string pelagem { get; set; } public string id_Microchip { get; set; } public Nullable<int> num_CIA { get; set; } public string registro_kenel { get; set; } public string pai { get; set; } public string mae { get; set; } public Nullable<int> cod_Castrado { get; set; } public Nullable<int> cod_Acesso_Rua { get; set; } public Nullable<int> cod_Proprietario { get; set; } public Nullable<int> cod_prop_anterior { get; set; } public byte[] imagem { get; set; } } }
View gerada:
@model IEnumerable<OG.ViewModels.Animal_Imagem> @{ Layout = null; } <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width" /> <title>Index</title> </head> <body> <p> @Html.ActionLink("Create New", "Create") </p> <table> <tr> <th> @Html.DisplayNameFor(model => model.cod_Foto) </th> <th> @Html.DisplayNameFor(model => model.data_Cadastro) </th> <th> @Html.DisplayNameFor(model => model.nome) </th> <th> @Html.DisplayNameFor(model => model.cod_Sexo) </th> <th> @Html.DisplayNameFor(model => model.data_Nasc) </th> <th> @Html.DisplayNameFor(model => model.cod_Especie_Comp) </th> <th> @Html.DisplayNameFor(model => model.cod_Raca) </th> <th> @Html.DisplayNameFor(model => model.pelagem) </th> <th> @Html.DisplayNameFor(model => model.id_Microchip) </th> <th> @Html.DisplayNameFor(model => model.num_CIA) </th> <th> @Html.DisplayNameFor(model => model.registro_kenel) </th> <th> @Html.DisplayNameFor(model => model.pai) </th> <th> @Html.DisplayNameFor(model => model.mae) </th> <th> @Html.DisplayNameFor(model => model.cod_Castrado) </th> <th> @Html.DisplayNameFor(model => model.cod_Acesso_Rua) </th> <th> @Html.DisplayNameFor(model => model.cod_Proprietario) </th> <th> @Html.DisplayNameFor(model => model.cod_prop_anterior) </th> <th></th> </tr> @foreach (var item in Model) { <tr> <td> @Html.DisplayFor(modelItem => item.cod_Foto) </td> <td> @Html.DisplayFor(modelItem => item.data_Cadastro) </td> <td> @Html.DisplayFor(modelItem => item.nome) </td> <td> @Html.DisplayFor(modelItem => item.cod_Sexo) </td> <td> @Html.DisplayFor(modelItem => item.data_Nasc) </td> <td> @Html.DisplayFor(modelItem => item.cod_Especie_Comp) </td> <td> @Html.DisplayFor(modelItem => item.cod_Raca) </td> <td> @Html.DisplayFor(modelItem => item.pelagem) </td> <td> @Html.DisplayFor(modelItem => item.id_Microchip) </td> <td> @Html.DisplayFor(modelItem => item.num_CIA) </td> <td> @Html.DisplayFor(modelItem => item.registro_kenel) </td> <td> @Html.DisplayFor(modelItem => item.pai) </td> <td> @Html.DisplayFor(modelItem => item.mae) </td> <td> @Html.DisplayFor(modelItem => item.cod_Castrado) </td> <td> @Html.DisplayFor(modelItem => item.cod_Acesso_Rua) </td> <td> @Html.DisplayFor(modelItem => item.cod_Proprietario) </td> <td> @Html.DisplayFor(modelItem => item.cod_prop_anterior) </td> <td> @Html.ActionLink("Edit", "Edit", new { /* id=item.PrimaryKey */ }) | @Html.ActionLink("Details", "Details", new { /* id=item.PrimaryKey */ }) | @Html.ActionLink("Delete", "Delete", new { /* id=item.PrimaryKey */ }) </td> </tr> } </table> </body> </html>
-
Wilson,
Na sua View, onde está o trecho de código que mencionei para adicionar?
@{ var base64 = Convert.ToBase64String(model.imagem); var imgSrc = String.Format("data:image/gif;base64,{0}", base64); } <img src='@imgSrc' style="max-width:100px; max-height:100px;" />
Tenta adicionar. Se resolver, marque como resposta!
Valeu!
-
-
Wilson,
Se você gerou sua View por Scaffolding, talvez você tenha feito o processo antes de adicionar a propriedade na ViewModel.
Mas enfim, é só adicionar mais uma <TD> no final com esse código
@{ var base64 = Convert.ToBase64String(model.imagem); var imgSrc = String.Format("data:image/gif;base64,{0}", base64); } <img src='@imgSrc' style="max-width:100px; max-height:100px;" />
-
Acho que fiz algoo errado!
<table>
<tr>
<th>
@Html.DisplayNameFor(model => model.imagem)
</th>
<th>
@Html.DisplayNameFor(model => model.cod_Foto)
</th>
<th>
@Html.DisplayNameFor(model => model.data_Cadastro)
</th>
<th>
@Html.DisplayNameFor(model => model.nome)
</th>
<th>
@Html.DisplayNameFor(model => model.cod_Sexo)
</th>
<th>
@Html.DisplayNameFor(model => model.data_Nasc)
</th>
<th>
@Html.DisplayNameFor(model => model.cod_Especie_Comp)
</th>
<th>
@Html.DisplayNameFor(model => model.cod_Raca)
</th>
<th>
@Html.DisplayNameFor(model => model.pelagem)
</th>
<th>
@Html.DisplayNameFor(model => model.id_Microchip)
</th>
<th>
@Html.DisplayNameFor(model => model.num_CIA)
</th>
<th>
@Html.DisplayNameFor(model => model.registro_kenel)
</th>
<th>
@Html.DisplayNameFor(model => model.pai)
</th>
<th>
@Html.DisplayNameFor(model => model.mae)
</th>
<th>
@Html.DisplayNameFor(model => model.cod_Castrado)
</th>
<th>
@Html.DisplayNameFor(model => model.cod_Acesso_Rua)
</th>
<th>
@Html.DisplayNameFor(model => model.cod_Proprietario)
</th>
<th>
@Html.DisplayNameFor(model => model.cod_prop_anterior)
</th>
<th></th>
</tr>
@foreach (var item in Model) {
<tr>
<td>
@{
var base64 = Convert.ToBase64String(model.imagem);
var imgSrc = String.Format("data:image/gif;base64,{0}", base64);
}
<img src='@imgSrc' style="max-width:100px; max-height:100px;" />
</td>
<td>
@Html.DisplayFor(modelItem => item.cod_Foto)
</td>
<td>
@Html.DisplayFor(modelItem => item.data_Cadastro)
</td>
<td>
@Html.DisplayFor(modelItem => item.nome)
</td>
<td>
@Html.DisplayFor(modelItem => item.cod_Sexo)
</td>
<td>
@Html.DisplayFor(modelItem => item.data_Nasc)
</td>
<td>
@Html.DisplayFor(modelItem => item.cod_Especie_Comp)
</td>
<td>
@Html.DisplayFor(modelItem => item.cod_Raca)
</td>
<td>
@Html.DisplayFor(modelItem => item.pelagem)
</td>
<td>
@Html.DisplayFor(modelItem => item.id_Microchip)
</td>
<td>
@Html.DisplayFor(modelItem => item.num_CIA)
</td>
<td>
@Html.DisplayFor(modelItem => item.registro_kenel)
</td>
<td>
@Html.DisplayFor(modelItem => item.pai)
</td>
<td>
@Html.DisplayFor(modelItem => item.mae)
</td>
<td>
@Html.DisplayFor(modelItem => item.cod_Castrado)
</td>
<td>
@Html.DisplayFor(modelItem => item.cod_Acesso_Rua)
</td>
<td>
@Html.DisplayFor(modelItem => item.cod_Proprietario)
</td>
<td>
@Html.DisplayFor(modelItem => item.cod_prop_anterior)
</td>
<td>
@Html.ActionLink("Edit", "Edit", new { /* id=item.PrimaryKey */ }) |
@Html.ActionLink("Details", "Details", new { /* id=item.PrimaryKey */ }) |
@Html.ActionLink("Delete", "Delete", new { /* id=item.PrimaryKey */ })
</td>
</tr>
}
</table>Server Error in '/' Application.
Compilation Error
Description: An error occurred during the compilation of a resource required to service this request. Please review the following specific error details and modify your source code appropriately.
Compiler Error Message: CS0103: The name 'model' does not exist in the current context
Source Error:Line 81: <td> Line 82: @{ Line 83: var base64 = Convert.ToBase64String(model.imagem); Line 84: var imgSrc = String.Format("data:image/gif;base64,{0}", base64); Line 85: }
Source File: d:\Documents\Visual Studio 2013\Projects\OG\G\Views\Animal_ImagemDetails\Index.cshtml Line: 83Show Detailed Compiler Output:Show Complete Compilation Source:
Version Information: Microsoft .NET Framework Version:4.0.30319; ASP.NET Version:4.0.30319.18408 -
Altere para isso:
@{ var base64 = Convert.ToBase64String(item.imagem); var imgSrc = String.Format("data:image/gif;base64,{0}", base64); } <img src='@imgSrc' style="max-width:100px; max-height:100px;" />
- Marcado como Resposta Wilson Boris quinta-feira, 21 de julho de 2016 16:39
-
Aeh GIGANTE, 100%.
certinho, agora vou para o edit...
André, eu achei melhor continuar neste mesmo Post um dúvida.
Vamos lá.
Eu tinha um Controler AnimalCompanhia porém sem o campo imagem, então criei a ViewModels, um novo controller e uma View Index.
Pois bem, a dúvida é que estou com dois controllers (AnimalCompanhia e AnimalImagemDetails), rsrs.
O que devo fazer para estruturar meu CRUD?
- Editado Wilson Boris sexta-feira, 22 de julho de 2016 11:39 complemento