使用Javascript重新加载HTML Img标记

时间:2013-10-10 05:10:18

标签: javascript ajax asp.net-mvc-3

我尝试使用组合选择更改加载图像:

通常我可以按照以下方式加载图片:

Razor查看:

<img id="imgPhotoIcon" src="@Url.Action("GetPhoto", "Contractor", new { id = Model.ContactPersonnelID })" alt="Photo" style="width:150px; height:150px" />

控制器部分:

public Image GetPhoto(int id)
        {
            ContactPersonnel oContactPersonnel = new ContactPersonnel();
            oContactPersonnel = oContactPersonnel.GetWithImage(id, (Guid)Session[SessionInfo.wcfSessionID]);
            if (oContactPersonnel.Photo != null)
            {
                MemoryStream m = new MemoryStream(oContactPersonnel.Photo);
                System.Drawing.Image img = System.Drawing.Image.FromStream(m);
                img.Save(Response.OutputStream, ImageFormat.Jpeg);
                return img;
            }
            else
            {
                return null;
            }
        }

现在我想基于所选项目加载具有组合选择更改的图像 任何人帮助我

1 个答案:

答案 0 :(得分:1)

这里的基本问题我认为你需要将图像的url作为图像的来源,所以你需要使用json返回图像url。以下是ajax方法,它将被调用你的组合框的更改.Id是你想要的输入传递给method.Or你可以返回字节数组的base64string到ajax success

$.ajax({
                            cache:true,
                            type: "POST",
                            url: "@(Url.Action("GetPhoto", "Contractor"))",
                            data: "id=" + id,
                            success: function (data) {

  $('#imgPhotoIcon').attr('src', "data:image/jpg;base64," + data);

                                                   }
        });

以下是控制器操作

public Actionresult GetPhoto(int id)
        {
       //logic to get picture url goes here 
       // string picture=GetPictureUrl(id);

      byte[] imageByteArray = images;//Return byte array here
return Json(new { base64imgage =  Convert.ToBase64String(imageByteArray) }
                , JsonRequestBehavior.AllowGet);
        }

希望有所帮助