2017-10-09 24 views
0

アップロードされたイメージをデータベースからカルーセルにロードするmvcプロジェクトを構築しようとしています。私が持っている問題は、画像はバイト[]リストを作成し、JsonResultとしてコントローラから見るために送信します。問題は私のビューでJSコードのコントローラから返される各要素へのアクセスを取得する方法を知らないことです。 は、ここに私のコントローラです:JsonResultから値を取得する

public JsonResult GetImages(string date, string sessionNumber) 
    { 
     int selectedSessionNumber = Convert.ToInt32(sessionNumber); 
     Guid getClassInfoId = (Guid)Session["infoId"]; 
     var getSessionId= (from c in db.Session 
      where c.ClassInfoID == getClassInfoId && c.SessionNumber == selectedSessionNumber 
      select c.ID).ToList(); 
     List<byte[]> getPics =new List<byte[]>(); 

     foreach (var item in getSessionId) 
     {   
      getPics.Add((from c in db.ClassPicture where c.SessionID == item select c.PicFile).First()); 

     } 
     List<string> imagesBase64 = new List<string>(); 
     foreach (var pics in getPics) 
     { 
      var base64 = Convert.ToBase64String(pics); 
      imagesBase64.Add(base64); 
     } 

     return Json(imagesBase64, JsonRequestBehavior.AllowGet); 

、これが私のjsのコードです:

function ShowImage() { 
       $.ajax({ 
        url: '@Url.Action("GetImages", "Main")', 
        type: 'POST', 
        traditional: true, 
        data: { 'date': selectedDate, 'sessionNumber': selectedSession }, 
        success: function (myData) { 
          var imgSrc = "data:image/jpeg;base64," + myData; 
           $('<div class="item"><img src=' + 
            imgSrc + 
            '><div class="carousel-caption"></div></div>').appendTo('.carousel-inner'); 
           $('<li data-target="#carousel-example-generic" data-slide-to= 0></li>') 
            .appendTo('.carousel-indicators'); 
           // } 
           //} 
           $('.item').first().addClass('active'); 
           $('.carousel-indicators > li').first().addClass('active'); 
           $('#carousel-example-generic').carousel(3); 


           //  $('#carousel-example-generic').carousel(); 
          } 
        }); 
      }; 

答えて

1
  1. データは、サーバーから戻って期待しているタイプ( 'JSON' にあなたのjQueryのAJAX dataTypeを指定します)。
  2. を使用してループを使用すると、$.each(myData, function(idx, imageBase64) { ... })を使用します。
関連する問題