UpdatePanel与PostBackTrigger的应用实例

最新推荐文章于 2025-12-17 12:30:35 发布

原创最新推荐文章于 2025-12-17 12:30:35 发布 · 6.7k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#asp #postback #textbox #server #triggers #download

C# 专栏收录该内容

77 篇文章

订阅专栏

本文介绍了一个文件下载系统的实现细节，特别是如何在用户界面通过RadioButtonList选择下载选项并实时更新文件大小预估，同时利用UpdatePanel避免页面完全刷新，提高用户体验。

这段代码实现的作用是实现从数据库中下载文件，并且将文件打包成zip包。在前台页面上有一些下载选项，由一个RadioButtonList和TextBox组成。TextBox用来填写文件名，RadioButtonList用来设置下载选项，可以选择下载默认图片或者是缩微图。

考虑到下载文件需要占用带宽，如果文件很大，比如100M，以目前普通的ADSL下载速度512KB计算，也要花上一段时间的，所以将文件大小控制在一定的范围内还是比较实际的。

所以用户点击提交按钮时，首先计算出下载文件的大小，如果超过10M，则弹出对话框提示该用户，是否继续下载。同样，用户在变更下载选项时，也要计算下载文件的大小。个人觉得这不是最好的做法，做好的做法应该在点击提交按钮时再进行计算文件大小的工作，这样可以节省开销，但由于本人能力有限，目前只能在RadioButtonList选项变更时计算下载文件的大小。

由于RadioButtonList选项变更时，会进行PostBack，所以使用了UpdatePane，避免页面刷新，不过这样就有问题了，因为提交按钮是需要PostBack的，而不是AsyncPostBack。

参考了一些资料，主要是关于UpdatePanel中Trigger的使用，最后加了这么一句代码，就解决了问题。

这是指定提交按钮要触发PostBack，哪怕该控件是放置在UpdatePanel中。

关于UpdatePanel与Trigger的使用，可以参见我之前的2篇帖子，已经写的非常明确。

前台代码：

<asp:UpdatePanel runat="server" ID="UpdatePanel1" UpdateMode="Conditional">
    <ContentTemplate>
        <table class="table100" cellpadding="0" cellspacing="0">
            <tr>
                <td class="LabelTdStyle">
                    <asp:Label ID="lblDownloadOptions" runat="server" Text="Download Options:" ></asp:Label>
                </td>
                <td>
                    <asp:RadioButtonList ID="rbtDownloadOptions" runat="server" AutoPostBack="True" OnSelectedIndexChanged="rbtDownloadOptions_SelectedIndexChanged">
                        <asp:ListItem Value="True" Selected="True">Download default pictures.</asp:ListItem>
                        <asp:ListItem Value="False">Download thumbnail pictures.</asp:ListItem>
                    </asp:RadioButtonList>
                </td>
            </tr>
            <tr>
                <td class="LabelTdStyle">
                    <asp:Label ID="lblZIPFileName" runat="server" Text="ZIP File Name:"></asp:Label>
                </td>
                <td>
                    <asp:TextBox ID="txtZIPFileName" runat="server"></asp:TextBox>
                    <asp:RequiredFieldValidator ID="rfvZIPFileName" runat="server" ErrorMessage="ZIP file name is required."
                        ValidationGroup="vgDownloadPictures" ControlToValidate="txtZIPFileName">*</asp:RequiredFieldValidator>
                    <asp:RegularExpressionValidator ID="revZIPFileName" runat="server" ErrorMessage="The Zip file name can contain only letters, numbers, periods (.), hyphens (-), and underscores (_). <br />4-character minimum; 25-character maximum"
                        ControlToValidate="txtZIPFileName" ValidationGroup="vgDownloadPictures" ValidationExpression="^[/w/-/.]{4,25}$">*</asp:RegularExpressionValidator></td>
            </tr>
            <tr class="tr10">
                <td class="LabelTdStyle">
                     
                </td>
                <td>
                    <asp:ValidationSummary ID="vs" runat="server" ValidationGroup="vgDownloadPictures" />
                </td>
            </tr>
            <tr>
                <td colspan="2" align="right">
                    <asp:Button ID="btnDownloadPictures" runat="server" Text="Download" OnClick="btnDownloadPictures_Click" ValidationGroup="vgDownloadPictures">
                    </asp:Button>
                    <asp:Button ID="btnCancel" runat="server" Text="Cancel" OnClick="btnCancel_Click"></asp:Button>
                </td>
            </tr>
            <tr>
                <td colspan="2" align="right">
                    <asp:Label ID="lblDownloadConfirm" runat="server" Text="Are you sure to continue to download this zip file, it would be more than 10 Megabytes?"></asp:Label>
                    <asp:Label ID="lblNoGiftPicturesToDownload" runat="server" Text="No gift pictures to download."></asp:Label>
                </td>
            </tr>
        </table>
    </ContentTemplate>
    <Triggers>
        <asp:PostBackTrigger ControlID="btnDownloadPictures" />
    </Triggers>
</asp:UpdatePanel>

<script type="text/javascript" language="javascript">
function DownloadConfirm()
{
    if ( typeof( Page_Validators) != "undefined" )
    {
        for(var i=0;i<Page_Validators.length;i++)
        {
            ValidatorValidate(Page_Validators[i]);
            if (!Page_Validators[i].isvalid && Page_Validators[i].validationGroup == 'vgDownloadPictures')
            {
                return true;
            }
        }
        return window.confirm(document.getElementById("<%=this.lblDownloadConfirm.ClientID %>").innerHTML);
    }
}
</script>

后台代码：

        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                if (IsGiftPictureSizeExceedMaximumLimitation())
                {
                    this.btnDownloadPictures.Attributes.Add("onclick", "javascript:if(!DownloadConfirm()) return false;");
                }
            }
        }

        protected void rbtDownloadOptions_SelectedIndexChanged(object sender, EventArgs e)
        {
            if (IsGiftPictureSizeExceedMaximumLimitation())
            {
                this.btnDownloadPictures.Attributes.Add("onclick", "javascript:if(!DownloadConfirm()) return false;");
            }
            else
            {
                this.btnDownloadPictures.Attributes.Remove("onclick");
            }
        }