2

DB から新しいデータをフェッチするためのバックエンド コードを実行しているときに、回転するホイール ポップアップをページに配置しようとしています。これが私が試したものですが、これまでのところ動作したくありません。何も表示されません。チェックボックスがクリックされたときに何かを表示したい (CheckedChanged)、それは何かが db からフェッチされているときです。

ここに私が持っているajaxコードがあります:

  <asp:UpdatePanel ID="UpdatePanel1" runat="server">

                    <Triggers>
                       <asp:AsyncPostBackTrigger controlid="cbAll" eventname="CheckedChanged" />
                    </Triggers>

                    <ContentTemplate>
                    </ContentTemplate>

                 </asp:UpdatePanel>



<asp:updateprogress associatedupdatepanelid="UpdatePanel1"
    id="updateProgress" runat="server">
    <progresstemplate>
        <div id="progressBackgroundFilter"></div>
        <div id="processMessage"> Loading...<br /><br />
             <img alt="Loading" src="../images/ajax-loader.gif" />
        </div>
    </progresstemplate>
</asp:updateprogress>

チェックボックス コントロールは次のとおりです。

 <asp:CheckBox ID="cbAll" runat="server" Checked="true" Text="Show me everything" ForeColor="White"
        Visible="false" AutoPostBack="True" 
        oncheckedchanged="cbAll_CheckedChanged" />
4

4 に答える 4

1

コードを少し変更します。

トリガーは必要ありません。イベントには AutoPostBack チェックボックスがあります。

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
        <%--<Triggers>
            <asp:AsyncPostBackTrigger ControlID="cbAll" EventName="CheckedChanged" />
        </Triggers>--%>
        <ContentTemplate>
            <asp:CheckBox ID="cbAll" runat="server" Checked="true" Text="Show me everything"
                ForeColor="White" Visible="false" AutoPostBack="True" OnCheckedChanged="cbAll_CheckedChanged" />
        </ContentTemplate>
    </asp:UpdatePanel>
    <asp:UpdateProgress AssociatedUpdatePanelID="UpdatePanel1" ID="updateProgress" runat="server">
        <ProgressTemplate>
            <div id="progressBackgroundFilter">
            </div>
            <div id="processMessage">
                Loading...<br />
                <br />
                <img alt="Loading" src="../images/ajax-loader.gif" />
            </div>
        </ProgressTemplate>
    </asp:UpdateProgress>

これが役立つことを願っています。

于 2012-07-17T19:32:57.513 に答える
0

これを試してみてください。また、スクリプト マネージャーのブログを忘れないでください。

<asp:UpdatePanel ID="UpdatePanel1" runat="server">

    <Triggers>
       <asp:AsyncPostBackTrigger controlid="cbAll" eventname="CheckedChanged" />
    </Triggers>

    <ContentTemplate>
        <asp:updateprogress associatedupdatepanelid="UpdatePanel1" id="updateProgress" runat="server">
            <progresstemplate>
            <div id="progressBackgroundFilter"></div>
            <div id="processMessage"> Loading...<br /><br />
             <img alt="Loading" src="../images/ajax-loader.gif" />
            </div>
            </progresstemplate>
        </asp:updateprogress> 
    </ContentTemplate>
 </asp:UpdatePanel>

ソース

于 2012-07-17T20:22:08.030 に答える
0


`

.divWaiting { 位置: 絶対; オーバーフロー: 非表示; テキスト整列: 中央; 上: 0; 左: 0; 高さ: 100%; 幅: 100%; パディングトップ: 40%;

}

.divWaiting #div1
{
  position: relative;
  top: 0;
  left: 0;
  background-color: White;
  width: 180px;
  left: 460px;
  border: 2px solid #870307;
  border-radius: 6px;
  text-align: center;

}

回転ホイールの .gif 画像をダウンロード

于 2015-08-03T10:52:22.290 に答える
0

過去に、更新進行状況コントロールをスキップして、代わりにPageRequestManagerbeginRequest および endRequest イベントを処理することで、このようなことを行いました。私の場合、ページの UI もブロックしたかったので、jQuery blockUIプラグインを使用しました。

次の div をページのルートのどこかに配置します。

<div id="processMessage">
    Loading...
    <br />
    <br />
    <img src="/images/ajax-loader.gif" alt="Loading" />
</div>

そして、次の css でスタイルを設定します。

#updatingDiv
{
    width: 75px;
    height: 75px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding: 10px;
    display: none;
    background-color: #EEEEEE;
    border: solid 1px #AAAAEE;
}

次の JavaScript を追加します。

$(function() {
    Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(function() {
        $.blockUI({ message: $('#updatingDiv'), css: { border: 'none', background: 'transparent'} });
    });
    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function() {
        $.unblockUI();
    });
});

前述のjQueryライブラリと blockUI プラグインを必ず含める必要があります。

もちろん、必要に応じて css/html を変更できます。

于 2012-07-17T19:40:12.630 に答える