Показать двоичное изображение в сетке с всплывающим

Question

Показать двоичное изображение в сетке с всплывающим

0

У меня есть asp.net datagrid на моей странице. Эта сетка будет иметь три столбца. Идентификатор, дата и фотография.

Столбец фотографий является фактическим столбцом таблицы VARBINARY (MAX).

Когда пользователь нажимает на фотографию (которая будет либо текстом, либо значком), я хочу открыть мода jquery с фотографией в полном размере. Пользователь, который может щелкнуть правой кнопкой мыши и сохранить, если захочет.

Я никогда не делал это раньше. Пытался искать в сети, но я нахожу только примеры отображения изображения в столбце, чего я не хочу.

jpgrassi 02 апр. 2014, в 16:09

Источник

1

проверьте это: aspsnippets.com/Articles/…
SpiderCode 02 апр. 2014, в 13:27
0

Спасибо! Это привело меня к тому, чтобы показать диалог. Но теперь, как мне отобразить изображение в диалоге? Если я отобразлю изображение на самом столбце, могу ли я восстановить его в диалоговом окне?
jpgrassi 02 апр. 2014, в 13:35
0

посмотрите на мой ответ. не забудьте поднять голос и отметить это как ответ.
SpiderCode 02 апр. 2014, в 15:19

Показать ещё 1 комментарий

Теги:

c#

jquery

asp.net

datagrid

1 ответ

Ещё вопросы

Спасибо! Это привело меня к тому, чтобы показать диалог. Но теперь, как мне отобразить изображение в диалоге? Если я отобразлю изображение на самом столбце, могу ли я восстановить его в диалоговом окне?
посмотрите на мой ответ. не забудьте поднять голос и отметить это как ответ.

SpiderCode · Accepted Answer · 2014-04-02T13-57-00.000Z

См. Ниже пример кода, чтобы отобразить небольшое изображение в сетке и отобразить его большим, щелкнув по нему.

<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>

Благодарю. Для будущих ссылок, в моем случае, я сделал с небольшими отличиями. Я использовал обработчик http, чтобы получить байты изображения. Эти два примера вели меня: bit.ly/1pRq5vc и bit.ly/1ecyynE
это хорошо. Я должен был предложить то же самое, но я подумал, что это будет твой следующий вопрос :)