jquery模式打开到整页

时间:2021-12-19 11:22:48

I have a nested jquery modals Modal1 & modal2 both contain updatePanels. To update the panels I am using javascript:

我有一个嵌套的jquery模态Modal1和modal2都包含updatePanels。要更新面板,我使用的是javascript:

var prm = Sys.WebForms.PageRequestManager.getInstance();
prm._doPostBack('UpDateLookUp','');

UpDateLookUp is the id of the updatePanel for modal1. Modal1 contains the link, which is in the updatePanel, for modal2. Modal1 updatePanel is a search criteria(Find) outside of the panel which works great while I am on modal1 but when I open modal2 (has an wpdatePaneltoo) and I go back to modal1, select Find modal2 opens to full page and displays the info before it was closed & returned to modal1. If I click on the link that opened modal2 all is well it only occurs when I select a different button.

UpDateLookUp是modal1的updatePanel的id。 Modal1包含modPa2中updatePanel中的链接。 Modal1 updatePanel是面板外的搜索条件(Find),当我在modal1上工作时很好但是当我打开modal2(有一个wpdatePaneltoo)并且我回到modal1时,选择Find modal2打开到整页并显示之前的信息它被关闭并返回到modal1。如果我点击打开modal2的链接一切都很好,它只会在我选择一个不同的按钮时发生。

I am new to jquery so please help. this is the way our shop is going.

我是jquery的新手所以请帮助。这就是我们商店的方式。

1 个解决方案

#1


There are two or three things you'll want here. First of all, if whatever control you're hooking on is disappearing in your ajax post-back you'll want to re-hook your event handlers when the page reloads using the following:

这里有两三件你想要的东西。首先,如果你正在挂钩的任何控件正在你的ajax post-back中消失,你将需要在使用以下内容重新加载页面时重新挂钩事件处理程序:

function pageLoad(sender, args) 
{
    if (args.get_isPartialLoad()) 
    {
        //Re-hook code here
    }
}

or use the .live() function in the $(document).ready() function to add your event hooks. This function is well documented on JQuery UI's API site.

或者使用$(document).ready()函数中的.live()函数来添加事件挂钩。这个函数在JQuery UI的API站点上有详细记录。

Also, if you want an animation effect to hide something before doing the post-back (which will keep it from changing before the animation is complete) use the .Promise().Done() functions like so:

此外,如果您希望动画效果在执行回发之前隐藏某些内容(这将使其在动画完成之前不会更改),请使用.Promise()。Done()函数,如下所示:

$("#Detail").fadeOut().promise().done(function () 
{
    __doPostBack('<%= UpdatePanel1.ClientID %>', '');
});

Lastly, when you want an animation to happen when a post-back is complete to show its results, you can use all this in combination with a boolean variable that enables an action in the pageLoad function like so:

最后,当你想要一个回发完成以显示其结果时发生动画时,你可以将所有这些与一个布尔变量结合使用,该变量在pageLoad函数中启用一个动作,如下所示:

var ShowDetailsOnLoad = false;

function pageLoad(sender, args) 
{
    if (args.get_isPartialLoad()) 
    {
        if (ShowDetailsOnLoad)
        {
            $("#Detail").fadeIn();
            ShowDetailsOnLoad = false;
        }

        $('DetailVisMaker').click(function() 
        {
            $("#Detail").fadeOut().promise().done(function () 
            {
                __doPostBack('<%= UpdatePanel1.ClientID %>', '');
                ShowDetailsOnLoad = true;
            });
        });
    }
}

If the divs, HTML, & UpdatePanel are set up correctly, this code will show a detail div, and when the user clicks a link within it, it will fade the detail section out, run a post-back, then fade back in when the post-back is complete.

如果divs,HTML和UpdatePanel设置正确,此代码将显示详细信息div,当用户单击其中的链接时,它将淡出细节部分,运行回发,然后淡入时邮寄已完成。

#1


There are two or three things you'll want here. First of all, if whatever control you're hooking on is disappearing in your ajax post-back you'll want to re-hook your event handlers when the page reloads using the following:

这里有两三件你想要的东西。首先,如果你正在挂钩的任何控件正在你的ajax post-back中消失,你将需要在使用以下内容重新加载页面时重新挂钩事件处理程序:

function pageLoad(sender, args) 
{
    if (args.get_isPartialLoad()) 
    {
        //Re-hook code here
    }
}

or use the .live() function in the $(document).ready() function to add your event hooks. This function is well documented on JQuery UI's API site.

或者使用$(document).ready()函数中的.live()函数来添加事件挂钩。这个函数在JQuery UI的API站点上有详细记录。

Also, if you want an animation effect to hide something before doing the post-back (which will keep it from changing before the animation is complete) use the .Promise().Done() functions like so:

此外,如果您希望动画效果在执行回发之前隐藏某些内容(这将使其在动画完成之前不会更改),请使用.Promise()。Done()函数,如下所示:

$("#Detail").fadeOut().promise().done(function () 
{
    __doPostBack('<%= UpdatePanel1.ClientID %>', '');
});

Lastly, when you want an animation to happen when a post-back is complete to show its results, you can use all this in combination with a boolean variable that enables an action in the pageLoad function like so:

最后,当你想要一个回发完成以显示其结果时发生动画时,你可以将所有这些与一个布尔变量结合使用,该变量在pageLoad函数中启用一个动作,如下所示:

var ShowDetailsOnLoad = false;

function pageLoad(sender, args) 
{
    if (args.get_isPartialLoad()) 
    {
        if (ShowDetailsOnLoad)
        {
            $("#Detail").fadeIn();
            ShowDetailsOnLoad = false;
        }

        $('DetailVisMaker').click(function() 
        {
            $("#Detail").fadeOut().promise().done(function () 
            {
                __doPostBack('<%= UpdatePanel1.ClientID %>', '');
                ShowDetailsOnLoad = true;
            });
        });
    }
}

If the divs, HTML, & UpdatePanel are set up correctly, this code will show a detail div, and when the user clicks a link within it, it will fade the detail section out, run a post-back, then fade back in when the post-back is complete.

如果divs,HTML和UpdatePanel设置正确,此代码将显示详细信息div,当用户单击其中的链接时,它将淡出细节部分,运行回发,然后淡入时邮寄已完成。