页面重新加载时,打开特定的手风琴面板

发布于 2024-09-26 01:47:59 字数 1279 浏览 8 评论 0原文

我从手风琴面板发布一些数据,然后重新加载页面。我希望重新加载当前面板时打开并聚焦在屏幕上,而不是重新打开第一个面板并将我移回屏幕顶部。我知道我想打开哪个面板,所以我不需要代码来弄清楚面板,只需要知道如何显示它。

 $.post('<%= ResolveUrl("~/Contract/AddContractLocation") %>', $(form).serialize(), function (data) {
         if (data.Result == "success") {
              ... yada yada... 
              window.location.reload();
         }

编辑添加:

这是我初始化手风琴的方式:

$("#acc").accordion({
         autoHeight: false,
         navigation: true
});

这是基本结构:

<fieldset>
    <legend>Contract</legend>

    <div id="acc">
        <h3><a href="#contractinfo">Contract Info</a></h3>
        <div>
            stuff
        </div>
        <h3><a href="#locationandrs">Locations and Ratesheets</a></h3>   
        <div>
            stuff
        </div>
        <h3><a href="#auditibleterms">Auditable Terms</a></h3>
        <div>
            stuff
        </div>
        <h3><a href="#contractdocs">Contract Docs</a></h3>
        <div>
            stuff
        </div>
    </div>
</fieldset>

From an accordion panel, I post some data and then reload the page. I'd like on the reload for the current panel to be open and focused on the screen rather than re-opening the first panel and moving me back to the top of the screen. I know which panel I want open, so I don't need code to figure out the panel, just how to display it.

 $.post('<%= ResolveUrl("~/Contract/AddContractLocation") %>', $(form).serialize(), function (data) {
         if (data.Result == "success") {
              ... yada yada... 
              window.location.reload();
         }

Edit to Add:

This is how I initialize the accordion:

$("#acc").accordion({
         autoHeight: false,
         navigation: true
});

This is the basic structure:

<fieldset>
    <legend>Contract</legend>

    <div id="acc">
        <h3><a href="#contractinfo">Contract Info</a></h3>
        <div>
            stuff
        </div>
        <h3><a href="#locationandrs">Locations and Ratesheets</a></h3>   
        <div>
            stuff
        </div>
        <h3><a href="#auditibleterms">Auditable Terms</a></h3>
        <div>
            stuff
        </div>
        <h3><a href="#contractdocs">Contract Docs</a></h3>
        <div>
            stuff
        </div>
    </div>
</fieldset>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

笑咖 2024-10-03 01:47:59

大约一年来第一次回到这段代码,当我在做其他事情时能够解决这个问题。

var substr = window.location.href.split('#'); 
window.location.href = substr[0] + "#locationandrs";
window.location.reload();

First time back in this code in about a year, and while I was working on something else was able to figure this out.

var substr = window.location.href.split('#'); 
window.location.href = substr[0] + "#locationandrs";
window.location.reload();
烟沫凡尘 2024-10-03 01:47:59

您可以将返回值的 active 选项设置为 true 吗?您需要从链接中单击“选项”,但这是文档:

活动元素的选择器。放
设置为 false 则在开始时不显示任何内容。
需要可折叠:正确。代码示例

使用活动初始化手风琴
指定选项。

$( ".selector" ).accordion({ active: 2 });

获取或设置活动选项,之后
初始化。

//getter
var active = $( ".selector" ).accordion( "option", "active" );
//设置器
$( ".selector" ).accordion( "选项", "活动", 2 );

Can you set the active option to true on the returned value? You need to click on 'options' from the link but here's the docs:

Selector for the active element. Set
to false to display none at start.
Needs collapsible: true. Code examples

Initialize a accordion with the active
option specified.

$( ".selector" ).accordion({ active: 2 });

Get or set the active option, after
init.

//getter
var active = $( ".selector" ).accordion( "option", "active" );
//setter
$( ".selector" ).accordion( "option", "active", 2 );
江南月 2024-10-03 01:47:59

提交表单时发送隐藏参数,识别打开的面板。您获取此参数并在输出 HTML 代码期间使用它为适当的面板分配特殊 id。然后在 js 脚本中初始化 Accordion:

$('#accordion').accordion({ 
   ...
   ,active: '#panel_selected'
   ...
});
$('#panel_selected').get(0).scrollIntoView(false); // scroll until panel is visible

仅此而已!

On submitting form send hidden parameter, identifying open panel. You get this parameter and using it assign special id to appropriate panel during outputting HTML code. Then init accordion in js-script:

$('#accordion').accordion({ 
   ...
   ,active: '#panel_selected'
   ...
});
$('#panel_selected').get(0).scrollIntoView(false); // scroll until panel is visible

That's all!

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文