Oct 24, 2013, 10:21 PM
[CLOSED] DataView - screen jumping
Hi,
I have a viewport layout.
The center region is a page loaded dynamically via Mode=Frame.
In that page, I have a DataView that is longer than the height of the center region.
When a user scrolls down to click a different one, the page jumps to the top.
How can I stop that?
Example here: http://screencast-o-matic.com/u/VrWY/ScreenJump
ViewPort Def:
I have a viewport layout.
The center region is a page loaded dynamically via Mode=Frame.
In that page, I have a DataView that is longer than the height of the center region.
When a user scrolls down to click a different one, the page jumps to the top.
How can I stop that?
Example here: http://screencast-o-matic.com/u/VrWY/ScreenJump
ViewPort Def:
<ext:Viewport ID="Viewport1" runat="server" Layout="BorderLayout"> <ext:Panel runat="server" Title="Valuation Summary" ID="pnlContent" Region="Center" Border="false" AutoScroll="true" >
<TopBar>
<ext:Toolbar ID="Toolbar1" runat="server" Flat="true" >
<Items>
<ext:SplitButton ID="ccyBut" runat="server" Text="All" IconAlign="Right" Icon="World">
<Menu>
<ext:Menu ID="Menu1" runat="server">
<Items>
<ext:MenuItem ID="MenuItem1" runat="server" Text="All" Icon="World">
<Listeners>
<Click Handler="SaveFilterSelection('All');#{pnlContent}.getBody().App.ContentPlaceHolder1_hidControlTypeId.setValue(-1); #{pnlContent}.getBody().App.ContentPlaceHolder1_Store1.reload(); " />
</Listeners>
</ext:MenuItem>
<ext:MenuItem ID="MenuItem5" runat="server" Text="Narrative" Icon="PageWhiteWord">
<Listeners>
<Click Handler="SaveFilterSelection('Narrative');#{pnlContent}.getBody().App.ContentPlaceHolder1_hidControlTypeId.setValue(1); #{pnlContent}.getBody().App.ContentPlaceHolder1_Store1.reload(); " />
</Listeners>
</ext:MenuItem>
<ext:MenuItem ID="MenuItem6" runat="server" Text="Fiscal" Icon="ChartBar">
<Listeners>
<Click Handler="SaveFilterSelection('Fiscal');#{pnlContent}.getBody().App.ContentPlaceHolder1_hidControlTypeId.setValue(2); #{pnlContent}.getBody().App.ContentPlaceHolder1_Store1.reload(); " />
</Listeners>
</ext:MenuItem>
</Items>
<Listeners>
<Click Handler="this.up('splitbutton').setText(menuItem.text);this.up('splitbutton').setIconCls(menuItem.iconCls);" />
</Listeners>
</ext:Menu>
</Menu>
</ext:SplitButton>
<ext:Button ID="Button2" runat="server" Icon="BulletPlus" Text="Expand All">
<Listeners>
<Click Handler="ExpandAllSections(); #{pnlContent}.getBody().App.ContentPlaceHolder1_Dashboard.el.select('.group-header').removeCls('collapsed');" />
</Listeners>
</ext:Button>
<ext:Button ID="Button4" runat="server" Icon="BulletMinus" Text="Collapse All">
<Listeners>
<Click Handler="SaveValuationSummaryState(''); #{pnlContent}.getBody().App.ContentPlaceHolder1_Dashboard.el.select('.group-header').addCls('collapsed');" />
</Listeners>
</ext:Button>
<ext:ToolbarSpacer ID="ToolbarSpacer1" runat="server" Width="30" />
<%-- <ext:DisplayField runat="server" Html="<div class='item-wrap1_false' style='width:60px;height:18px;text-align:center;'> <b>Narrative</b></div><div class='item-wrap2_false' style='width:60px;height:18px;text-align:center;'> <b>Fiscal</b></div><div class='item-wrap1_true' style='width:60px;height:18px;text-align:center;'> <b>Read Only</b></div>" />
--%> </Items>
</ext:Toolbar>
</TopBar>
<LayoutConfig>
<ext:BorderLayoutConfig ReserveScrollbar="true" />
</LayoutConfig>
<Loader ID="Loader1" runat="server" AutoLoad="true" Mode="Frame" RemoveAll="true" Url="/Sections/ValuationSummary.aspx" >
</Loader>
</ext:Panel> <ext:Panel
ID="DashBoardPanel"
runat="server"
Cls="items-view"
Flex="800"
Height="1900"
Border="false">
<Items>
<ext:DataView
ID="Dashboard"
runat="server" AutoDataBind="true"
SingleSelect="true"
ItemSelector="div.group-header" LoadingText="Fetching Valuation Summary..."
EmptyText="No Valuation Summary to display. Please select a company OR active quarter above.">
<Store>
<ext:Store ID="Store1" runat="server">
<Proxy>
<ext:AjaxProxy Url="../Handler/GetSummaries.ashx">
<ActionMethods Read="GET" />
<Reader>
<ext:JsonReader Root="result" TotalProperty="totalCount" />
</Reader>
</ext:AjaxProxy>
</Proxy>
<Parameters>
<ext:StoreParameter Name="docId" Value="#{hidDocumentId}.getValue()" Mode="Raw" />
<ext:StoreParameter Name="portId" Value="#{hidPortfolioId}.getValue()" Mode="Raw" />
<ext:StoreParameter Name="contentType" Value="#{hidControlTypeId}.getValue()" Mode="Raw" />
</Parameters>
<Model>
<ext:Model ID="Model1" runat="server">
<Fields>
<ext:ModelField Name="Title" />
<ext:ModelField Name="TitleClean" />
<ext:ModelField Name="Items" Type="Object" />
</Fields>
</ext:Model>
</Model>
<Listeners>
<Load Handler="ReOpenGroups();" Delay="500" />
</Listeners>
</ext:Store>
</Store>
<Tpl ID="Tpl1" runat="server">
<Html>
<div id="items-ct" style="height: auto;">
<tpl for=".">
<div id="GRP_{TitleClean}" class="group-header collapsed" >
<h2><div onclick="KeepTrackOfGroups('{TitleClean}',$('#GRP_{TitleClean}').attr('class'));">{Title}</div></h2>
<dl tabindex="{ContentId}">
<tpl for="Items">
<div id="{Count}Card" class="item-wrap{ControlTypeId}_{ReadOnly}" ondblclick="javascript:GoToLocation('{Label}','{HeaderLabel}',{ContentId},{ControlTypeId}, {FundId},{Count},{ReadOnly},'{ShortName}');" >
<div class="imageStyle"> <img src="/image/contentType{ControlTypeId}{ReadOnly}.png" title="{ContentId}" /></div>
<div class="headerStyle">{HeaderLabel} {[IsMultiFund(values.ShortName,values.MultiFund)]} </div>
<div class="dateStyle" id="{ContentId}date{Count}">
<span class="dateStyle">
{[UpdateTimeLabel(values.ModifiedBy,values.ModifiedOn)]}
</span>
</div>
<div id="htmlRev" class="quixClass{ControlTypeId}" >
<tpl if="ContentId != -1">
<img src="/image/magnifier.png" onclick="javascript:PreviewContent( {ContentId},{ControlTypeId},'{HeaderLabel}',{Count});" title="Preview" style=" cursor: pointer;" />
</tpl>
<tpl if="HasNote!=0">
<img src="/image/note_go.png" title="See Notes ({HasNote})" onclick="javascript:GotoNote('{Label}','{HeaderLabel}',{ContentId}, {FundId},0,{Count});" style=" cursor: pointer;"/>
</tpl>
<tpl if="HasNote == 0">
<img src="/image/note_add.png" title="Add Note" onclick="javascript:GotoNote('{Label}','{HeaderLabel}',{ContentId}, {FundId},1,{Count});" style=" cursor: pointer;"/>
</tpl>
<tpl if="ContentId != -1">
<img src="/image/text_list_numbers.png" onclick="javascript:LoadVersion({ContentId},'{HeaderLabel}',{Count});" title="History" style=" cursor: pointer;" />
</tpl>
</div>
</div>
</tpl>
<div style="clear:both" />
</dl>
</div>
</tpl>
</div>
</Html>
</Tpl>
<Listeners>
<ItemClick Fn="itemClick" />
<Refresh Handler="this.el.select('.item-wrap').addClsOnOver('x-view-over');" Delay="100" />
</Listeners>
</ext:DataView>
</Items>
</ext:Panel>
Last edited by Daniil; Oct 29, 2013 at 11:59 AM.
Reason: [CLOSED]
Originally Posted by Baidaly
