Skip to main content
removeu 217 caracteres do conteúdo
Fonte Link

Tenho um painel do ASP.NET que mostra mensagens recentes e quero que o scroll sempre permaneça no fim (as mensagens são de baixo pra cima, como no WhatsApp).

Meu problema é que não consigo de jeito nenhum fazer o scroll ficar sempre no fim. Aqui está o que já tentei e não funcionou:

JS:

function scrollMsgs() {
    var pnl = document.getElementById("pnlMsgs");
    pnl.scrollTop = pnl.scrollHeight;
}

HTML:

<div class="row mb-4">
    <div class="col-12 rounded" id="divMsgs">
        <asp:Panel ID="pnlMsgs" runat="server">
            <asp:Label ID="lblMsg" runat="server" Text=""></asp:Label>
        </asp:Panel>
    </div>
</div>

Não encontrei uma forma de fazer isso no back-end, por issoComo estou tentando com JavaScript. E sim,chamando a função está sendo executada, porem não scrolla pra baixo.:


 
Protected Sub cmdPerguntar_Click(sender As Object, e As EventArgs) Handles cmdPerguntar.Click

    ...

    lblMsg.Text &= "texto texto texto texto [...]\n"

    Page.ClientScript.RegisterStartupScript(Page.GetType, "ScrollMsgs", "scrollMsgs();", True)
End Sub

UPDATE: Consegui o resultado esperadoO estranho é que com a seguinte gambiarra no JavaScript, porém não estou satisfeitofunciona:

function scrollMsgs() {
        setTimeout(function () {
        var pnl   let objDiv = document.getElementById("pnlMsgs");
        pnl    objDiv.scrollTop = pnlobjDiv.scrollHeight - pnlobjDiv.clientHeight;
    }, 1);
}

Tenho um painel do ASP.NET que mostra mensagens recentes e quero que o scroll sempre permaneça no fim (as mensagens são de baixo pra cima, como no WhatsApp).

Meu problema é que não consigo de jeito nenhum fazer o scroll ficar sempre no fim. Aqui está o que já tentei e não funcionou:

function scrollMsgs() {
    var pnl = document.getElementById("pnlMsgs");
    pnl.scrollTop = pnl.scrollHeight;
}

HTML:

<div class="row mb-4">
    <div class="col-12 rounded" id="divMsgs">
        <asp:Panel ID="pnlMsgs" runat="server">
            <asp:Label ID="lblMsg" runat="server" Text=""></asp:Label>
        </asp:Panel>
    </div>
</div>

Não encontrei uma forma de fazer isso no back-end, por isso estou tentando com JavaScript. E sim, a função está sendo executada, porem não scrolla pra baixo.


 

UPDATE: Consegui o resultado esperado com a seguinte gambiarra no JavaScript, porém não estou satisfeito:

function scrollMsgs() {
    setTimeout(function () {
        var pnl = document.getElementById("pnlMsgs");
        pnl.scrollTop = pnl.scrollHeight - pnl.clientHeight;
    }, 1);
}

Tenho um painel do ASP.NET que mostra mensagens recentes e quero que o scroll sempre permaneça no fim (as mensagens são de baixo pra cima, como no WhatsApp).

Meu problema é que não consigo de jeito nenhum fazer o scroll ficar sempre no fim. Aqui está o que já tentei e não funcionou:

JS:

function scrollMsgs() {
    var pnl = document.getElementById("pnlMsgs");
    pnl.scrollTop = pnl.scrollHeight;
}

HTML:

<div class="row mb-4">
    <div class="col-12 rounded" id="divMsgs">
        <asp:Panel ID="pnlMsgs" runat="server">
            <asp:Label ID="lblMsg" runat="server" Text=""></asp:Label>
        </asp:Panel>
    </div>
</div>

Como estou chamando a função:

Protected Sub cmdPerguntar_Click(sender As Object, e As EventArgs) Handles cmdPerguntar.Click

    ...

    lblMsg.Text &= "texto texto texto texto [...]\n"

    Page.ClientScript.RegisterStartupScript(Page.GetType, "ScrollMsgs", "scrollMsgs();", True)
End Sub

O estranho é que com a seguinte gambiarra, funciona:

function scrollMsgs() {
        setTimeout(function () {
            let objDiv = document.getElementById("pnlMsgs");
            objDiv.scrollTop = objDiv.scrollHeight - objDiv.clientHeight;
    }, 1);
}
adicionou 309 caracteres ao conteúdo
Fonte Link

Tenho um painel do ASP.NET que mostra mensagens recentes e quero que o scroll sempre permaneça no fim (as mensagens são de baixo pra cima, como no WhatsApp).

Meu problema é que não consigo de jeito nenhum fazer o scroll ficar sempre no fim. Aqui está o que já tentei e não funcionou:

function scrollMsgs() {
    var pnl = document.getElementById("pnlMsgs");
    pnl.scrollTop = pnl.scrollHeight;
}

HTML:

<div class="row mb-4">
    <div class="col-12 rounded" id="divMsgs">
        <asp:Panel ID="pnlMsgs" runat="server">
            <asp:Label ID="lblMsg" runat="server" Text=""></asp:Label>
        </asp:Panel>
    </div>
</div>

Não encontrei uma forma de fazer isso no back-end, por isso estou tentando com JavaScript. E sim, a função está sendo executada, porem não scrolla pra baixo.


UPDATE: Consegui o resultado esperado com a seguinte gambiarra no JavaScript, porém não estou satisfeito:

function scrollMsgs() {
    setTimeout(function () {
        var pnl = document.getElementById("pnlMsgs");
        pnl.scrollTop = pnl.scrollHeight - pnl.clientHeight;
    }, 1);
}

Tenho um painel do ASP.NET que mostra mensagens recentes e quero que o scroll sempre permaneça no fim (as mensagens são de baixo pra cima, como no WhatsApp).

Meu problema é que não consigo de jeito nenhum fazer o scroll ficar sempre no fim. Aqui está o que já tentei e não funcionou:

function scrollMsgs() {
    var pnl = document.getElementById("pnlMsgs");
    pnl.scrollTop = pnl.scrollHeight;
}

HTML:

<div class="row mb-4">
    <div class="col-12 rounded" id="divMsgs">
        <asp:Panel ID="pnlMsgs" runat="server">
            <asp:Label ID="lblMsg" runat="server" Text=""></asp:Label>
        </asp:Panel>
    </div>
</div>

Não encontrei uma forma de fazer isso no back-end, por isso estou tentando com JavaScript. E sim, a função está sendo executada, porem não scrolla pra baixo.

Tenho um painel do ASP.NET que mostra mensagens recentes e quero que o scroll sempre permaneça no fim (as mensagens são de baixo pra cima, como no WhatsApp).

Meu problema é que não consigo de jeito nenhum fazer o scroll ficar sempre no fim. Aqui está o que já tentei e não funcionou:

function scrollMsgs() {
    var pnl = document.getElementById("pnlMsgs");
    pnl.scrollTop = pnl.scrollHeight;
}

HTML:

<div class="row mb-4">
    <div class="col-12 rounded" id="divMsgs">
        <asp:Panel ID="pnlMsgs" runat="server">
            <asp:Label ID="lblMsg" runat="server" Text=""></asp:Label>
        </asp:Panel>
    </div>
</div>

Não encontrei uma forma de fazer isso no back-end, por isso estou tentando com JavaScript. E sim, a função está sendo executada, porem não scrolla pra baixo.


UPDATE: Consegui o resultado esperado com a seguinte gambiarra no JavaScript, porém não estou satisfeito:

function scrollMsgs() {
    setTimeout(function () {
        var pnl = document.getElementById("pnlMsgs");
        pnl.scrollTop = pnl.scrollHeight - pnl.clientHeight;
    }, 1);
}
adicionou 226 caracteres ao conteúdo
Fonte Link

Tenho um painel do ASP.NET que mostra mensagens recentes e quero que o scroll sempre permaneça no fim (as mensagens são de baixo pra cima, como no WhatsApp).

Meu problema é que não consigo de jeito nenhum fazer o scroll ficar sempre no fim. Aqui está o que já tentei e não funcionou:

function scrollMsgs() {
    var pnl = document.getElementById("pnlMsgs");
    pnl.scrollTop = pnl.scrollHeight;
}

O painel é do ASP.NET (<asp:Panel ID="pnlMsgs" runat="server">)HTML:

<div class="row mb-4">
    <div class="col-12 rounded" id="divMsgs">
        <asp:Panel ID="pnlMsgs" runat="server">
            <asp:Label ID="lblMsg" runat="server" Text=""></asp:Label>
        </asp:Panel>
    </div>
</div>

Não encontrei uma forma de fazer isso no back-end, por isso estou tentando com JavaScript. E sim, a função está sendo executada, porem não scrolla pra baixo.

Tenho um painel do ASP.NET que mostra mensagens recentes e quero que o scroll sempre permaneça no fim (as mensagens são de baixo pra cima, como no WhatsApp).

Meu problema é que não consigo de jeito nenhum fazer o scroll ficar sempre no fim. Aqui está o que já tentei e não funcionou:

function scrollMsgs() {
    var pnl = document.getElementById("pnlMsgs");
    pnl.scrollTop = pnl.scrollHeight;
}

O painel é do ASP.NET (<asp:Panel ID="pnlMsgs" runat="server">)

Não encontrei uma forma de fazer isso no back-end, por isso estou tentando com JavaScript. E sim, a função está sendo executada, porem não scrolla pra baixo.

Tenho um painel do ASP.NET que mostra mensagens recentes e quero que o scroll sempre permaneça no fim (as mensagens são de baixo pra cima, como no WhatsApp).

Meu problema é que não consigo de jeito nenhum fazer o scroll ficar sempre no fim. Aqui está o que já tentei e não funcionou:

function scrollMsgs() {
    var pnl = document.getElementById("pnlMsgs");
    pnl.scrollTop = pnl.scrollHeight;
}

HTML:

<div class="row mb-4">
    <div class="col-12 rounded" id="divMsgs">
        <asp:Panel ID="pnlMsgs" runat="server">
            <asp:Label ID="lblMsg" runat="server" Text=""></asp:Label>
        </asp:Panel>
    </div>
</div>

Não encontrei uma forma de fazer isso no back-end, por isso estou tentando com JavaScript. E sim, a função está sendo executada, porem não scrolla pra baixo.

título editado
Link
Carregando
Fonte Link
Carregando