9

ASP.net AJAX を使い始めました (ついに☺)。asp:UpdateProgress と一緒に更新パネルがあります。私の問題: UpdateProgress は、div タグとしてレンダリングされるため、常に改行を強制します。

代わりに強制的にスパンにする方法はありますか? テーブルを使用せずに他のコントロールと同じ行に表示したり、CSS の絶対位置を震えさせたりしたいと考えています。

それが違いを生むなら、私はASP.net AJAX 1.0と.net 3.0にこだわっています。

4

8 に答える 8

10

UpdateProgress を style="position:absolute;" でスパン内に配置するだけです。

于 2008-10-16T07:41:12.370 に答える
8

私は同じ問題を抱えていました。updateProgress にインラインでレンダリングするように指示する簡単な方法はありません。独自の updateProgress 要素をロールする方がよいでしょう。beginRequest リスナーと endRequest リスナーを追加して、インラインで表示する要素の表示と非表示を切り替えることができます。これを行う方法を示す簡単なページは次のとおりです。

aspx

<form id="form1" runat="server">
    <div>
        <asp:ScriptManager ID="sm" runat="server"></asp:ScriptManager>


    <asp:UpdatePanel runat="server" ID="up1" UpdateMode="Always">
        <ContentTemplate>
            <asp:Label ID="lblTest" runat="server"></asp:Label>
            <asp:Button ID="btnTest" runat="server" Text="Test" OnClick="btnTest_OnClick" />
        </ContentTemplate>    
    </asp:UpdatePanel>
    <img id="loadingImg" src="../../../images/loading.gif" style="display:none;"/><span>Some Inline text</span>

    <script>

        Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(function(sender, args) {
            if (args.get_postBackElement().id == "btnTest") {
                document.getElementById("loadingImg").style.display = "inline";
            }
        });


        Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function(sender, args) {
            if (document.getElementById("loadingImg").style.display != "none") {
                document.getElementById("loadingImg").style.display = "none";
            }
        });

    </script>

    </div>
</form>

cs

public partial class updateProgressTest : System.Web.UI.Page
{
    protected void btnTest_OnClick(object sender, EventArgs e)
    {
        System.Threading.Thread.Sleep(1000);
        this.lblTest.Text = "I was changed on the server! Yay!";
    }
}
于 2008-09-04T14:07:33.223 に答える
3

私の解決策：CSSで

.progress[style*="display: block;"] {
     display:inline !important;
}

そしてASP

<asp:UpdateProgress  class="progress" ID="UpdateProgress1" runat="server">
于 2015-02-02T13:26:46.360 に答える
2

この問題に対する自分の解決策についてブログを書きました。 http://www.joeaudette.com/solving-the-aspnet-updateprogress-div-problem.aspx

私が行ったことは、MonoプロジェクトからUpdateProgressコントロールを借用し、divではなくスパンとしてレンダリングするように変更することでした。また、コントロールに関連付けられた変更されたms-ajax javascriptをコピーし、display：blockを使用する代わりにdisplay：inlineとdisplay：noneを切り替えるように変更しました

私の投稿には、変更されたファイルを含む.zipファイルがリンクされています。

于 2009-11-09T16:07:02.593 に答える
1

より適切で最も簡単な方法は、スパンを使用して UpdatePanel 内で UpdateProgress を使用することです。これをテストしたところ、IE、FF、Chrome ブラウザで正しく動作しました。このような：

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
    <ContentTemplate>
        ..........
        <span style="position:absolute;">
            <asp:UpdateProgress ID="UpdateProgress1" runat="server"
                AssociatedUpdatePanelID="UpdatePanel1">
                    <ProgressTemplate>
                        <img alt="please wait..."src="/Images/progress-dots.gif" />
                    </ProgressTemplate>
            </asp:UpdateProgress> 
        </span> 
    </ContentTemplate>
</asp:UpdatePanel>
于 2011-07-25T08:28:40.693 に答える
0

私の解決策はそれを次のように包むことでした...

<div class="load-inline">LOADER HERE</div>

そして私のCSSでは...

.load-inline {display:inline-block}
于 2011-08-12T00:22:56.273 に答える
0

float:leftラベル/テキストボックスなどに適用するだけです。次のように:

ヘッダーで：

<style type="text/css">
.tbx 
{
    float:left;
}

体内で：

<asp:TextBox CssClass="tbx" .... />
于 2009-09-16T14:53:15.417 に答える
-2

次のように div インラインを作成できます。

<div style="display:inline">stuff</div>

私はそれがあなたのためにdivをレンダリングすることに懐疑的です...私のページでこの問題が発生したことを覚えていません...

于 2008-09-03T20:35:15.547 に答える