首先说下背景:最近某公司起了个一卡通申请流程,表单中需要上传登记照然后显示,大概如图!
实现步骤如下:
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" /> <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存取!