zoukankan      html  css  js  c++  java
  • 一个很简单的图片上传后立即显示在页面的控件(c#)

    首先说下背景:最近某公司起了个一卡通申请流程,表单中需要上传登记照然后显示,大概如图!

    实现步骤如下:

    1 我在a页面放了2个元素,一个"添加"按钮,一个"image",添加按钮的作用是弹出上传图片的b页面,b页面上传成功后刷新a页面,

     因为我设置了image的src属性,

     imgZJ.Src = "GetImgContents.aspx?FormInstId=" + ParameterContext.FormInstId
    GetImgContents.aspx页面的主要作用是输入图片

    2 代码大概如下:
    a 页面----------------
    <script type="text/javascript">
        function UploadImg() {
            var FormInstID = getObj("hidFormInstID").value;
            var ActID = getObj("hidActID").value;
            var flag = PopSelect_pop_ModalDialog("证件上传", "Control/UserControl/ImgUpload.aspx?FormInstID=" + FormInstID + "&ActID=" + ActID, "650", "180");
            if (flag == "refresh")
            // location.reload();
                getObj("<%=btnRender.ClientID %>").click();
    
        }
    
    </script>
    <table width="100%" class="form_datalist margin_top_10">
        <tr>
            <td align="center">
                <img id="imgZJ" width="200" height="200" runat="server" alt="上传的证件照在此处显示!" />
            </td>
        </tr>
        <tr>
            <td align="center">
                <cc1:FWButton ID="btnAddAttach" runat="server" Text="添加" CssClass="ui-btn ui-btn-add"
                    OnClientClick="UploadImg(); return false;" />
                <asp:HiddenField ID="hidFormInstID" runat="server" />
                <asp:HiddenField ID="hidActID" runat="server" />
            </td>
        </tr>
        <tr style="display: none">
            <td>
                <asp:Button ID="btnRender" runat="server" OnClick="btnRender_Click" />
            </td>
        </tr>
    </table>

    b页面------------------------

     <div>
            <table width="100%" class="form_datalist margin_top_10">
                <tr>
                    <td>
                        <asp:FileUpload Style=" 400px; border: 1px solid Lavender; background: Lavender;
                            font: 12px; height: 18px;" ID="fileUpload" runat="server" />
                    </td>
                </tr>
                <tr>
                    <td colspan="13">
                        <span class='ui-icon ui-icon-remind' style='float: left; margin-right: .3em;'></span>
                        <strong>提醒:</strong>证件照的类型限于如下几种格式(.jpg|.jpeg|.bmp|.png),证件照的大小应小于1M。
                    </td>
                </tr>
                <tr>
                    <td align="center">
                        <asp:Button ID="btnAddAttach" class="ui-btn ui-btn-save" onmouseover="this.className='ui-btn ui-btn-save-hover'"
                            onmouseout="this.className='ui-btn ui-btn-save'" runat="server" Text="保存" OnClick="btnAddAttach_Click" />&nbsp;&nbsp;&nbsp;
                        <asp:Button ID="btnClose" class="ui-btn ui-btn-cancel" onmouseover="this.className='ui-btn ui-btn-cancel-hover'"
                            onmouseout="this.className='ui-btn ui-btn-cancel'" Text="退出" runat="server" OnClientClick="window.close();" />
                    </td>
                </tr>
            </table>
        </div>

    GetImgContents.aspx页面前端代码无,后台代码为-----------------

       string formInstId = Request["FormInstID"];
                DBHelper f_DBHelper = DatabaseFactory.CreateDatabase(FWConfig.FileConnectionString);
               // byte[] bytes = new FormFileBLL(f_DBHelper).GetFileContentByCondition("2838C9B0-ED93-4E5F-8AE3-A37B681F9555", (int)Util.Common.EnumUtil.OjectType.PassPort);
    
                 byte[] bytes = new FormFileBLL(f_DBHelper).GetFileContentByCondition(formInstId, (int)Util.Common.EnumUtil.OjectType.PassPort);
                 if (bytes != null)
                 {
                     Response.ContentType = "image/Gif";
                     Response.OutputStream.Write(bytes, 0, bytes.Length);
                     Response.End();  
                 }

     注:附件全部采用的是sqlserver08的新特性filestream存取!

  • 相关阅读:
    POJ 2352 &amp;&amp; HDU 1541 Stars (树状数组)
    SSH三大框架的工作原理及流程
    稀疏表示
    Linux程序设计学习笔记----多线程编程线程同步机制之相互排斥量(锁)与读写锁
    [面经] 南京SAP面试(上)
    JAVA数组的定义及用法
    花指令
    计算机认证考试种类
    《C语言编写 学生成绩管理系统》
    spice for openstack
  • 原文地址:https://www.cnblogs.com/jangwewe/p/3197438.html
Copyright © 2011-2022 走看看