Сохранить текущую область аккордеона jQuery открытой после обратной передачи ASP.NET?
У меня есть аккордеон jQuery на asp.net aspx weppage. В областях у меня есть кнопки asp.net. Когда я нажимаю на кнопку, область, в которой я был, закрывает и перезагружает страницу, принимая значение по умолчанию к первой области. Я не возражаю против перезагрузки, но есть ли способ сохранить текущую область открытой после перезагрузки. Прямо сейчас я просто называю аккордеон () на отделении с идентификатором аккордеона.
3 ответа
Вы можете использовать скрытое поле ввода для сохранения активного индекса аккордеона во время обратной передачи, а затем заполнить его с помощью javascript во время события изменения аккордеона.
<asp:HiddenField ID="hidAccordionIndex" runat="server" Value="0" />
<script language="javascript" type="text/javascript">
$(function(){
var activeIndex = parseInt($('#<%=hidAccordionIndex.ClientID %>').val());
$("#accordion").accordion({
autoHeight:false,
event:"mousedown",
active:activeIndex,
change:function(event, ui)
{
var index = $(this).children('h3').index(ui.newHeader);
$('#<%=hidAccordionIndex.ClientID %>').val(index);
}
});
});
</script>
Вы, вероятно, могли бы придумать более эффективный способ захвата активного индекса во время события изменения, но это, похоже, работает.
Когда страница загрузилась, она извлекает активный индекс из скрытого поля и сохраняет его в переменной. Затем он инициализирует аккордеон, используя полученный индекс и настраиваемую функцию, чтобы запускать событие изменения, которое записывает новый индекс в скрытое поле всякий раз, когда активируется новая панель.
Во время обратной передачи значение скрытого поля сохраняется в ViewState, поэтому при повторной загрузке страницы аккордеон инициализируется индексом последней нажатой панели.
Написать индекс или идентификатор панели аккордеонной панели, в которой нажата кнопка с использованием CLISTICSCRICT.REGISTERSTARTUPScript . Предположим, что пользователь нажимает кнопку с именем BTNSUBMIT , которая находится на панели 3. Тогда она будет работать так:
protected void btnSubmitClick(object sender, EventArgs e)
{
//process button click
//class this function at end:
SetAccordionPane(3);
}
//you can call this function every time you need to set specific pane to open
//positon
private void SetAccordionPane(int idx)
{
var s="<script type=\"text/javascript\">var paneIndex = "
+ idx +"</script">;
ClientScript.RegisterStartupScript(typeof(<YourPageClass>, s);
}
Теперь в JavaScript:
$(function(){
if(paneIndex)
{
$('.selector').accordion({active: paneIndex});
}
else
{
$('.selector').accordion();
}
});
Используйте опцию «Active», когда вы создаете аккордеон. Что-то вроде этого:
$('.selector').accordion({ active: 2 });
Это активирует второй вариант в аккордеоне. Вы также можете пройти селектор для выбора по ID.