zoukankan      html  css  js  c++  java
  • FileUpload与UpdatePanel

    UpdatePanel是Asp.net实现页面部分刷新所使用的控件。还是挺不错的控件,避免了不少因为刷新所带来的不良用户体验(点击Asp.net按钮触发页面刷新,清楚text box中的内容)。但UpdatePanel是不能与FileUpload同时使用的。这也是微软明确指出的问题。同时使用FileUpload与UpdatePanel需要“耍点小聪明”。一个切实可行的方法是结合IFrame一起使用。使用UpdatePanel包含一个IFrame,然后写一个上传文件的页面,将这个页面放到IFrame里面。具体实现如下:

    1. 在主页面Test.aspx中使用UpdatePanel包住Iframe
    ...
    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
      <ContentTemplate>
        <iframe id="uploadFile" name="uploadFile" src="FileUpload.aspx" style="border-style: none"></iframe>
      </ContentTemplate>
    </asp:UpdatePanel>
    ...
    IFrame的src属性指向有FileUpload控件的页面FileUpload.aspx

    2. 在FileUpload.aspx页面中放置FileUpload控件
    ...
    <asp:FileUpload ID="fileUploadImage" runat="server" />&nbsp;
    <asp:Button ID="btnUploadImage" runat="server" Text="上传" OnClick="btnUploadImage_Click" />
    ...
    这样就可以实现FileUpload与UpdatePanel同时使用。但这还远远不足!主页面需要和iframe中的页面进行交互才满足实际需求。交互可以通过JavaScript来实现。具体如下:

    1. 在FileUpload.aspx(包含在iframe页面中的页面)调用主页面的JavaScript
    在FileUpload.aspx中定义以下JavaScript:
    function callBack()
    {
      var fileName = $("#hdfTmpPath").val();
      window.parent.callBack(fileName); //调用主页面JavaScript
    }

    在主页面Test.aspx中定义被上面调用的JavaScript:
    function callBack(fileName)
    {

      //运行代码或调用其他FileUpload.aspx中的JavaScript,传入的参数可以参与JavaScript的运行或传达到其他JavaScript中运行。

    }

    2. 在主页面Test.aspx调用FileUpload.aspx的JavaScript
    在FileUpload.aspx中定义以下JavaScript供主页面调用:
    function UploadWindowJavaScript(参数)
    {

      //运行代码或调用其他FileUpload.aspx中的JavaScript,传入的参数可以参与JavaScript的运行或传达到其他JavaScript中运行。
    }

    在主页面使用以下代码调用FileUpload.aspx中的JavaScript
    document.getElementById("uploadFile").contentWindow.UploadWindowJavaScript(参数); //主页面调用FileUpload中的JavaScript

    以上便是同时使用UpdatePanel和FileUpload控件的事例方法。

  • 相关阅读:
    BestCoder Round #71 (div.2) (hdu 5621)
    BestCoder Round #71 (div.2) (hdu 5620 菲波那切数列变形)
    BestCoder Round #69 (div.2) Baby Ming and Weight lifting(hdu 5610)
    BestCoder Round #70 Jam's math problem(hdu 5615)
    BestCoder Round #68 (div.2) tree(hdu 5606)
    poj 2299 Ultra-QuickSort(归并排序或是bit 树+离散化皆可)
    hdu 3874 Necklace(bit树+事先对查询区间右端点排序)
    HDU 4300 Clairewd’s message(KMP)
    HDU 3308 LCIS(线段树单点更新区间合并)
    PKU 3667 Hotel(线段树)
  • 原文地址:https://www.cnblogs.com/MatrixBlogs/p/7213813.html
Copyright © 2011-2022 走看看