用彈出的方式在網格中顯示二進制圖像

我在我的頁面上有一個asp.net數據網格。這個網格將有三列。身份證，日期和照片。用彈出的方式在網格中顯示二進制圖像

照片列是表VARBINARY（MAX）上的實際列。

當用戶點擊照片（這將是一個文本或圖標），我想打開一個jQuery模式與照片的全尺寸。用戶比可以右鍵單擊並保存，如果他想。

我從來沒有這樣做過。試圖在網上搜索，但我只找到將圖像顯示在列中的示例，這不是我想要的。

2014-04-02 jpgrassi

檢查：http://www.aspsnippets.com/Articles/Display-GridView-Row-details-inside-jQuery-Dialog-Modal- Popup-in-ASPNet.aspx – SpiderCode

謝謝！那種引導我展示對話的方式。但現在，我如何在對話框中顯示圖像？如果我確實在列上顯示圖像，我可以在對話框中重新創建它嗎？ – jpgrassi

看看我的答案。不要忘記註冊並將其標記爲答案。 – SpiderCode

請參閱下面的代碼示例以在網格中顯示小圖像並通過單擊顯示大圖像。

<asp:GridView runat="server" ID="gvData" AutoGenerateColumns="False"> 
    <Columns> 
     <asp:TemplateField> 
      <ItemTemplate> 
       <img src='<%# "data:image/gif;base64," + Eval("Data") %>' onclick="DisplayImage(this)" height="10" width="10" /> 
      </ItemTemplate> 
     </asp:TemplateField> 
    </Columns> 
</asp:GridView> 

<%--Popup dialog to display large image--%> 
<div id="dialog" style="display: none"> 
    <img height="100" width="100" id="imgLargeImage" /> 
</div>

注：這裏我的形象類型是gif所以它更新，按您的圖像類型。

JavaScript來在彈出的顯示圖像：

<script type="text/javascript"> 
    function DisplayImage(ctrl) { 

     document.getElementById('imgLargeImage').src = ctrl.src; 

     $("#dialog").dialog({ 
      title: "View Details", 
      buttons: { 
       Ok: function() { 
        $(this).dialog('close'); 
       } 
      }, 
      modal: true 
     }); 
    } 
</script>

來源

2014-04-02 15:18:43 SpiderCode

謝謝。爲了將來的參考，在我的情況下，我做了小的差異。我使用http處理程序來獲取圖像的字節。這兩個例子指導我： http://bit.ly/1pRq5vc和http://bit.ly/1ecyynE – jpgrassi

多數民衆贊成在這件事情。我應該建議相同，但我認爲這將是你的下一個問題:) – SpiderCode

用彈出的方式在網格中顯示二進制圖像

回答

相關問題