Hi @all ,
how can I check if a ext:panel scroll down ?
like this :
ThanksCode:$(window).scroll(function () {
if ($(window).scrollTop() == $(document).height() - $(window).height()) {
alert();
}
});
Printable View
Hi @all ,
how can I check if a ext:panel scroll down ?
like this :
ThanksCode:$(window).scroll(function () {
if ($(window).scrollTop() == $(document).height() - $(window).height()) {
alert();
}
});
Hi @ontiv,
Please take a look at the example.
Example
See alsoCode:<%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html>
<html>
<head runat="server">
<title>Ext.NET v2 Example</title>
<script>
var onAfterRender = function (panel) {
panel.body.on("scroll", function (e, t) {
if (t.scrollTop - Ext.fly(t).getHeight() >= 0) {
alert("You are at the bottom!");
}
});
};
</script>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />
<ext:Panel
runat="server"
Height="200"
Width="200"
AutoScroll="true">
<Items>
<ext:Container runat="server" Height="400" />
</Items>
<Listeners>
<AfterRender Fn="onAfterRender" />
</Listeners>
</ext:Panel>
</form>
</body>
</html>
http://docs.sencha.com/ext-js/4-1/#!...nt-afterrender
http://docs.sencha.com/ext-js/4-1/#!...-property-body
http://docs.sencha.com/ext-js/4-1/#!...able-method-on
http://docs.sencha.com/ext-js/4-1/#!...t-event-scroll
Hello Daniil,
the Listener "AfterRender" was not fired.. ??
Code:<ext:Panel ID="p_center" runat="server" Region="Center" Layout="VBoxLayout" AutoScroll="true" Border="false">
<LayoutConfig>
<ext:VBoxLayoutConfig Align="Stretch" DefaultMargins="0 50 0 50" />
</LayoutConfig>
<Listeners>
<AfterRender Fn="onAfterRender" />
</Listeners>
Code:<script type="text/javascript">
var onAfterRender = function (panel) {
debugger;
panel.body.on("scroll", function (e, t) {
if (t.scrollTop - Ext.fly(t).getHeight() >= 0) {
alert("You are at the bottom!");
}
});
};
It fires for me. Please provide a full sample to reproduce.
Also please try to replace "debugger;" with "alert('test');".
Sorry, my mistake!
It fires for me too but the result of the "if query" is always less than zero !?
Attachment 5602Code:
if (t.scrollTop - Ext.fly(t).getHeight() >= 0) {
alert("You are at the bottom!");
}
I was wrong with the condition. Please use:
Code:var onAfterRender = function (panel) {
panel.body.on("scroll", function (e, t) {
if (t.offsetHeight + t.scrollTop >= t.scrollHeight) {
alert("You are at the bottom!");
}
});
};
This works fine for me :)
Thank you!