asp.net 文件上傳與刷新與asp.net頁面與iframe之間的數(shù)據(jù)傳輸
更新時間:2009年12月15日 21:46:42 作者:
眾所周知微軟所提供的updatepanel不能支持文件上傳的異步刷新,但是往往當你在項目中的其他頁面實現(xiàn)了異步刷新之后,客戶就會問你為什么有文件上傳的頁面就不能實現(xiàn)異步刷新呢?這時我們可能說一堆理由,但是最后大部分還是會妥協(xié)于客戶。
具體我們?nèi)绾螌崿F(xiàn)文件的異步刷新,目前網(wǎng)上已經(jīng)有了很多文章來解決這個問題,但是會用到大量的javascript,由于本人編碼功力尚淺,所以之今沒有高清其中的所以然,但是在解決的方案中他們貌似都用到了iframe,這讓我茅塞頓開,所以我就說說用這個處理刷新的思路。
首先一個實際的頁面中往往是會有較多的內(nèi)容,我們暫時把它分為A,B兩個區(qū)域,A區(qū)域是內(nèi)容區(qū)域,我們可以用updatepanel來實現(xiàn)異步刷新,B區(qū)域是上傳區(qū)域,我們用div已經(jīng)ifame占位,其中上傳的具體功能實現(xiàn)我們可以放到C頁面中,這樣當點擊按鈕刷新B區(qū)域的時候,我們可以向C頁面?zhèn)髦祦砀吕锩娴膬?nèi)容,同樣當我們點擊按鈕刪除或者保存內(nèi)容時,也可以獲取C頁面中的內(nèi)容,這樣就基本上滿足了無刷新的感覺。
其實這種方式并不能稱之為異步刷新,因為我們只是用iframe來實現(xiàn)頁面的局部刷新從而滿足一種無刷新的感覺而已。
如果這樣處理的話,asp.net頁面與iframe之間的傳值就會成為另一個問題,其實這個問題如果你知道,就會比較簡單,但是不知道的話,就有點無從下手。
網(wǎng)上可能也提供了很多方案處理傳值,我使用的是使用javascript來獲取控件從而取到他里面所包含的值。
這個是獲取iframe f1,以及頁面C中的 img控件
var objFrame = document.getElementById("f1");
var objPicture = objFrame.contentWindow.document.getElementById("imgPicture");
當然你也可以在頁面C中去獲取父頁面的控件,從而獲取值
var objHid = this.parent.document.getElementById("")
這個是包含ifrmae的div
<div id="iconpicture">
<iframe id="f1" style="width: 300px; height: 300px" src="UploadImage.aspx" scrolling="no"
frameborder="0" border="0" frameborder="no"></iframe>
</div>
這個實現(xiàn)方式我已經(jīng)在項目中成功的使用了,其實如果這樣處理主要的難點已經(jīng)不再于具體功能的實現(xiàn),而在于頁面的布局在多瀏覽器下的適應了。當然我提供的這些javascript 是滿足多瀏覽器的。
首先一個實際的頁面中往往是會有較多的內(nèi)容,我們暫時把它分為A,B兩個區(qū)域,A區(qū)域是內(nèi)容區(qū)域,我們可以用updatepanel來實現(xiàn)異步刷新,B區(qū)域是上傳區(qū)域,我們用div已經(jīng)ifame占位,其中上傳的具體功能實現(xiàn)我們可以放到C頁面中,這樣當點擊按鈕刷新B區(qū)域的時候,我們可以向C頁面?zhèn)髦祦砀吕锩娴膬?nèi)容,同樣當我們點擊按鈕刪除或者保存內(nèi)容時,也可以獲取C頁面中的內(nèi)容,這樣就基本上滿足了無刷新的感覺。
其實這種方式并不能稱之為異步刷新,因為我們只是用iframe來實現(xiàn)頁面的局部刷新從而滿足一種無刷新的感覺而已。
如果這樣處理的話,asp.net頁面與iframe之間的傳值就會成為另一個問題,其實這個問題如果你知道,就會比較簡單,但是不知道的話,就有點無從下手。
網(wǎng)上可能也提供了很多方案處理傳值,我使用的是使用javascript來獲取控件從而取到他里面所包含的值。
這個是獲取iframe f1,以及頁面C中的 img控件
var objFrame = document.getElementById("f1");
var objPicture = objFrame.contentWindow.document.getElementById("imgPicture");
當然你也可以在頁面C中去獲取父頁面的控件,從而獲取值
var objHid = this.parent.document.getElementById("")
這個是包含ifrmae的div
<div id="iconpicture">
<iframe id="f1" style="width: 300px; height: 300px" src="UploadImage.aspx" scrolling="no"
frameborder="0" border="0" frameborder="no"></iframe>
</div>
這個實現(xiàn)方式我已經(jīng)在項目中成功的使用了,其實如果這樣處理主要的難點已經(jīng)不再于具體功能的實現(xiàn),而在于頁面的布局在多瀏覽器下的適應了。當然我提供的這些javascript 是滿足多瀏覽器的。
相關(guān)文章
.net Core連接MongoDB數(shù)據(jù)庫的步驟詳解
這篇文章主要給大家介紹了關(guān)于.net Core連接MongoDB數(shù)據(jù)庫步驟的相關(guān)資料,文中將實現(xiàn)的步驟一步步介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧。2018-02-02.Net Core中使用Autofac替換自帶的DI容器的示例
Autofac比Core中自帶的DI功能強大的多,比如:屬性注入、基于名稱注入、子容器、自定生存期管理、遲緩初始化,本文就詳細的來介紹一下.Net Core Autofac替換DI容器,感興趣的可以了解一下2021-06-06ASP.NET Core 2.0 WebApi全局配置及日志實例
下面小編就為大家分享一篇ASP.NET Core 2.0 WebApi全局配置及日志實例,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2017-12-12ASP.NET網(wǎng)站使用Kindeditor富文本編輯器配置步驟
首先下載編輯器然后部署編輯器最后在網(wǎng)頁中加入(ValidateRequest="false")引入腳本文件,具體配置步驟如下,有需求的朋友可以了解下哈2013-06-06ASP.NET Core跨站登錄重定向的實現(xiàn)新姿勢
這篇文章主要給大家介紹了關(guān)于ASP.NET Core實現(xiàn)跨站登錄重定向的相關(guān)資料,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2018-07-07