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:inline 和 display:none 之间切换，而不是使用 display:block

我的帖子中链接了一个 .zip 文件，其中包含修改后的文件。

于 2009-11-09T16:07:02.593 回答
1

更好和最简单的方法是在 UpdatePanel 中使用带有 span 的 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

只需应用于float:left您的标签/文本框等。像这样：

在标题中：

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

在身体里：

<asp:TextBox CssClass="tbx" .... />
于 2009-09-16T14:53:15.417 回答
0

我的解决方案是将其包装如下...

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

在我的 CSS 中，我使用...

.load-inline {display:inline-block}
于 2011-08-12T00:22:56.273 回答
-2

你可以像这样制作一个 div 内联：

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

不过，我怀疑它是否会为您呈现 div……我不记得我的页面上有这个问题……

于 2008-09-03T20:35:15.547 回答