JQuery Datentabelle anzeigen Bild von SQL db

Question

Ich bin mit jquery Datentabelle v 1.10.12

$(function() { 

      $('.datatable-basic').DataTable({ 
       "ajax": { 
        "url": "/Master/loadData", 
        "type": "GET", 
        "datatype": "json" 
       }, 
       "columns": [ 
         { data: "Id", "autoWidth": true }, 
         { data: "Name", "autoWidth": true }, 
       { data: "CustImage", "autoWidth": true } 
       ] 
      }); 

     }); 

Ich habe Bild in SQL-Datenbank-Tabelle gespeichert. CustImage“ist varbinary in SQL.

db.Customers.OrderBy(a => a.Name).ToList(); 

Wie in Datentabelle Bild anzuzeigen?

---

"columns": [ 
          { data: "Id", "autoWidth": true }, 
          { data: "Name", "autoWidth": true }, 
         { 
          "render": function (data, type, full, meta) { 
           return '<img id="image" src='@Url.Action("imageGenerate", "Master", new { imgData = full.CustImage})'/>'; 

          } 
         } 
       ] 

Ausnahme auslöst, Der Name 'voll' existiert nicht im aktuellen Kontext

public FileContentResult imageGenerate(byte[] imgData) 
     { 
      if (imgData != null) 
      { 
       return new FileContentResult(imgData, "image/jpg"); 
      } 
      return null; 
     } 

Answer 1

Versuchen Sie dies und überprüfen Sie Ihren Root-Pfad, wenn Sie.

"columns": [ 
          { data: "Id", "autoWidth": true }, 
          { data: "Name", "autoWidth": true }, 
         { 
          "render": function (data, type, full, meta) { 
           return '<img id="image" src="'@Url.Action("imageGenerate", "Master", new { imgData = full.CustImage})'"/>'; 

         } 
        } 
      ] 

Answer 2

Ich habe dies in mvc getan, nicht in der Lage, dies von Datatable zu tun.

<img src='@Url.Action("Generate", "Master", new { id = dr.ID })' style="width:auto;height:80px;" /> 




public FileContentResult imageGenerate(int id) 
     { 
      if (id != null) 
      { 
       var imageData = db.GetImageFromDB(id); 
       return new FileContentResult(imageData, "image/jpg"); 
      } 
      return null; 
     } 

Answer 3

Das full Variable ist ein JavaScript-Variable und kann nicht in Zusammenhang mit einem C# -Code verwendet werden.

Um die volle Variable oder eine andere JavaScript-Variable zu beziehen, haben Sie dies tun:

"columns": [ 
          { data: "Id", "autoWidth": true }, 
          { data: "Name", "autoWidth": true }, 
          { 
           "render": function (data, type, full, meta) { 
           var url = @Url.Action("imageGenerate", "Master", new { id = "_X_"}); 
           url = url.replace("_X_",full.CustImage); 
           return '<img id="image" src="'+url+"'/>'; 

          } 
         } 
       ] 

Wie Sie sehen können, bin ich den Inhalt der hte Bild nicht vorbei, sondern ich bin pasing die Kunden-ID, und in Ihrer Aktion, sollten Sie die ID des Kunden akzeptieren und laden Sie das Bild

public FileContentResult imageGenerate(int id) 
     { 
      var customer = db.Customers.Find(id) 
      if (customer != null) 
      { 
       return new FileContentResult(customer.CustImage, "image/jpg"); 
      } 
      return null; 
     } 

in Ihrer Aktion, stellen Sie sicher, dass Sie nicht laden Sie die CustImage Feld unnötige Datenbanktreffer zu vermeiden.

db.Customers.OrderBy(a => a.Name).Select(a=>new {Id,Name}).ToList();