Сохранение позиции страницы после обратной передачи
У меня есть якорь тег внутри listview, который расширяет / скрывает строку внутри listview, оба находятся внутри updatePanel.
код javascript anchor tage выглядит следующим образом:
<a onclick=" $(this).parent().parent().next().find('#notesTd').toggle();" href="#" id="notes_anch"><img src="../img/notes1.png" class="wiringImg" runat="server" id="notesImg" visible="false" width="40" /></a>
Это строка, которую показывает/скрывает тег привязки:
<td colspan="6" style="display: none;" id="notesTd" class="showHideNotes">Notes <div id="divScroll"> <asp:ListView runat="server" ID="notesView" DataSource="<%# Eval("NOTES", "{0}").Split('|') %>"> <LayoutTemplate> <ul> <li runat="server" id="itemPlaceholder" style="list-style: none;"></li> </ul> </LayoutTemplate> <EmptyItemTemplate>no notes to display</EmptyItemTemplate> <ItemTemplate> <li style="list-style: none; color: #000 !important;"> <%#string.Format("{0}",Container.DataItem) %> </li> <asp:Label runat="server" ID="lblNotes" Visible="false" Text='<%#string.Format("{0}",Container.DataItem) %>'></asp:Label> </ItemTemplate> </asp:ListView> </div> </td>
Он работает очень хорошо, показывает/скрывает, но проблема в том, что я хочу, чтобы страница оставалась в том же положении после щелчка якоря, но она продолжает идти наверх. Я перепробовал много решений, но безуспешно
любая помощь будет очень признательна
Заранее спасибо
Что я уже пробовал:
1-решение design / C#
MaintainScrollPositionOnPostback="true" OR Page.MaintainScrollPositionOnPostBack = true; //on page load
2-JavaScript решение:
<script type="text/javascript"> function SetScrollerPosition() { if (document.getElementById("XPos").value != "") { var x = document.getElementById("XPos").value; var y = document.getElementById("YPos").value; window.scrollTo(x, y); } document.getElementById("XPos").value = "0"; document.getElementById("YPos").value = "0"; } function GetScollerPosition() { var scrollX, scrollY; if (document.all) { if (!document.documentElement.scrollLeft) scrollX = document.body.scrollLeft; else scrollX = document.documentElement.scrollLeft; if (!document.documentElement.scrollTop) scrollY = document.body.scrollTop; else scrollY = document.documentElement.scrollTop; } else { scrollX = window.pageXOffset; scrollY = window.pageYOffset; } document.getElementById("XPos").value = scrollX; document.getElementById("YPos").value = scrollY; } </script> <input type="hidden" id="XPos" runat="server" /> <input type="hidden" id="YPos" runat="server" />
3-Еще одно решение javascript (аналогично #2)
<script type="text/javascript"> var xPos, yPos; var prm = sys.WebForms.PageRequestManager.getInstance(); function BeginRequestHandler(sender, args) { if ($get('<%=UpdatePanel1.ClientID%>') != null) { xPos = $get('<%=UpdatePanel1.ClientID%>').scrollLeft; yPos = $get('<%=UpdatePanel1.ClientID%>').scrollTop; } } function EndRequestHandler(sender, args) { if ($get('<%=UpdatePanel1.ClientID%>') != null) { $get('<%=UpdatePanel1.ClientID%>').scrollLeft = xPos; $get('<%=UpdatePanel1.ClientID%>').scrollTop = yPos; } } prm.add_beginRequest(BeginRequestHandler); prm.add_beginRequest(EndRequestHandler); </script>
Bryian Tan
Пожалуйста, покажите соответствующий код. Где находится элемент с идентификатором notesTd? Где находится якорь?
Samira Radwan
как якорь, так и (TD) внутри listview. notesTd-это таблица td пожалуйста, проверьте второй блок кода в моем вопросе. Спасибо!