JQuery toggle должен расширяться после перезагрузки страницы

Question

Я написал ниже код для Collapse/Разверните раздел. Он работает нормально. Наконец, если я нажму кнопку «Сохранить», и я снова загружаю страницу в asp.net. Таким образом, разделы снова собираются по умолчанию. Мне нужно, чтобы они снова расширялись. Как я могу это сделать?

$(function() { 
     $('tr.subCategory') 
      .css("cursor", "pointer") 
      .attr("title", "Click to expand/collapse") 
      .click(function() { 
     $(this).siblings('.RegText-' + this.id).toggle(); 
      }); 
      $('tr[@class^=RegText-]').hide().children('td'); 
    }) 

Answer 1

Если вы используете обновление панель вы можете нам о том, что $ (документ) .ready JQuery, называются только на начальной загрузке и ASP.NET AJAX's pageLoad() вызывается для каждой обратной передачи. Вы можете свернуть свой раздел в $ (документе). Уже так, что он изначально скрыт, а затем назначить обработчик кликов в pageLoad(), чтобы пользователи могли снова свернуть его, если им нужно после сохранения.

$(document).ready(function() {{ 
    $('tr[@class^=RegText-]').hide().children('td'); 
}}); 

function pageLoad() { 
    $('tr.subCategory').click(function() {         
     $(this).siblings('.RegText-' + this.id).toggle(); 
    });   
} 

Answer 2

Вы можете сохранить состояние с помощью:

• URL хэш: mysite.com # а = 1, B = 2 ... или же вы хотите записать свое состояние.
• Печенье
• window.name

На перезаряжания, проверьте записанное состояние, анализирующие его и повторно выполнить его в вашем коде.

Edit:

При выполнении то, что изменения в пользовательском интерфейсе вы должны записать это действие где-то (то есть панель A открыта), в какой-то код. Это могут быть имена, пары значений (ID, STATE | ID, STATE..etc) в строке или любом другом, что вы выберете. Затем вам необходимо запрограммировать механизм, который принимает эту информацию «сохраненного состояния» и повторно инициализирует интерфейс обратно туда, где он был.

Как только вы достигли способа представления и повторной инициализации состояния, вам нужно подумать о том, как вы его сохраните и извлечете.

Вы можете сохранить это файл cookie, если он не слишком большой. Когда страница загружается, проверьте файл cookie и проанализируйте данные и запустите процедуру повторной инициализации для восстановления пользовательского интерфейса.

Другое постоянное место для хранения данных - window.name, которое может содержать строку до 2 МБ. То же самое касается куки.

Третий способ - хранить информацию о состоянии по URL-адресу: document.location = document.location + "#" + stateData. Затем вы можете проанализировать, что находится в URL-адресе, чтобы захватить данные состояния.

Метод «url/hash» становится предпочтительным методом, поскольку он позволяет создавать закладки и является новой спецификацией, позволяющей поисковым роботам легко читать сайты на основе ajax.

См: http://code.google.com/intl/sv-SE/web/ajaxcrawling/docs/specification.html

Answer 3

вы могли бы использовать скрытый Div поле, и изменить ваши JS, чтобы установить скрытый текст ид расширенного поля на мыши. Ваша функция может проверить значение скрытого текста и показать поле, которое соответствует скрытому текстовому идентификатору.

на странице:

<div class="hidden" style="display:none;" /> 

в вашем .js

$(function() { 
     $('tr.subCategory') 
      .css("cursor", "pointer") 
      .attr("title", "Click to expand/collapse") 
      .click(function() { 
     $(this).siblings('.RegText-' + this.id).toggle(); 
       $('.hidden').text(this.id); // set the hidden field to the id shown 
      }); 
      $('tr[@class^=RegText-]').hide().children('td'); 
      $('#' + $('.hidden').text() + ''').show(); // show the id set in hidden field 
    })