asp.net web表单和jQuery：如何保存/恢复回发之间jquery的状态呢？ [英] asp.net webforms and jquery: How to save/restore jquery state between postbacks?

问题描述

我建立一个asp.net web表单（3.5 SP1）的应用程序，使用jQuery在那里我可以给动画UI，改变其状态。它伟大的工作，直到我开始做回发，那里的UI显然本身重置为初始状态。

I am building a asp.net webforms (3.5 sp1) application, using jquery where I can to animate the UI, change its state. It has worked great until I started doing postbacks, where the UI obviously resets itself to its initial state.

所以我的问题是，什么是保存和恢复回发之间的jQuery / UI状态的最佳实践？

So my question is, what are the best practices for saving and restoring jquery/UI state between postbacks?

谢谢，埃伊尔。

更新：非常感谢球员，大投入，坏我不能标志着一个以上的答案为答案

Update: Thanks a lot guys, great input, to bad I cant mark more than one answer as the "answer".

推荐答案

我通常存储之类的东西（在一个div组输入）菜单状态或过滤的知名度等在服务器端通过AJAX的会话。当一个菜单扩展或过滤器所示，点击处理程序将触发一个AJAX事件的Web服务将记录用户的会话菜单或过滤器的可见性状态。在回传我使用对应于每个菜单/过滤会话变量来设置它的通过CSS的初始状态。我觉得这是更好的用户体验，因为页面没有的闪存的，当它由JavaScript加载后，如果所做的更改客户端进行更新。

I typically store things like menu state or filter (set of inputs in a div) visibility, etc. server-side in the session via AJAX. When a menu expands or a filter is shown, the click handler will fire an AJAX event to a web service that will record the state of the menu or filter visibility in the user's session. On a postback I use the session variables corresponding to each menu/filter to set it's initial state via CSS. I find that this is better user experience since the page doesn't flash when it is updated by javascript after loading if you make the changes client-side.

例子 - 因为我在路上从一个项目这个不是实际的code和可能不完整。使用jQuery。对于Web Service的URL是要取决于你如何实现Web服务。我使用ASP.NET MVC（主要），所以我的将是一个控制器动作。

Example -- as I'm on the road this not actual code from a project and may be incomplete. Uses jQuery. The Url for the web service is going to depend on how you implement web services. I'm using ASP.NET MVC (mostly) so mine would be a controller action.

<script type='text/javascript'>
    $(document).ready( function() {
       $('#searchFilter').click( function()  {
           var filter = $(this);
           var filterName = filter.attr('id');
           var nowVisible = filter.css('display') === 'none';
           if (nowVisible) {
              filter.show();
           }
           else {
              filter.hide();
           }
           $.post('/controller/SetFilterVisibility',
                  { name: filterName, visibility: nowVisible } );
       });
    });
</script>


<div id='searchFilter' <%= ViewData["searchFilterVisibility"] %> >
    ...
</div>

服务器端code

Server-side code

[AcceptVerbs( HttpVerbs.POST )]
[Authorization]
public ActionResult SetFilterVisibility( string name, bool visible )
{
    Session[name] = visible;
    return Content( string.Empty );  // not used... 
}

[AcceptVerbs( HttpVerbs.GET )]
[Authorization]
public ActionResult SomeAction( int id )
{
    ...
    ViewData["searchFilterVisibility"] = Session["searchFilter"];
    ...
    return View();
}

这篇关于asp.net web表单和jQuery：如何保存/恢复回发之间jquery的状态呢？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！