Оставаться на текущей вкладке JQuery через пост назад? - PullRequest
19 голосов
/ 15 сентября 2010

Я использую вкладки jQuery и просмотр списка ASP.NET для отображения и редактирования некоторой информации.Моя проблема в том, что когда пользователь вставляет новую запись в один из элементов списка, мои вкладки jQuery возвращаются на первую вкладку.Есть ли способ отследить, на какой вкладке я нахожусь, или удержать ее на обратной стороне сообщения?

Ответы [ 7 ]

31 голосов
/ 27 октября 2011

В ASP.NET вы можете сохранить его в скрытом поле, не используя cookie (нет необходимости в ссылке на файл cookie jQuery).

Используйте это:

$(function () {
    $("#tabs").tabs({ 
        activate: function() {
            var selectedTab = $('#tabs').tabs('option', 'active');
            $("#<%= hdnSelectedTab.ClientID %>").val(selectedTab);
        },
        active: <%= hdnSelectedTab.Value %>
    });
});

Затем в теле объявите поле скрытых вкладок:

<asp:HiddenField ID="hdnSelectedTab" runat="server" Value="0" />

По сути, при выборе вкладки вы сохраняете значение выбранных вкладок в скрытом поле asp.Затем на шоу вы получаете значение.

30 голосов
/ 25 марта 2013

В более новых версиях jQuery и jQuery UI это будет:

$(function () {
    $("#tabs").tabs({
        activate: function() {
            var selectedTab = $('#tabs').tabs('option', 'active');
            $("#<%= hdnSelectedTab.ClientID %>").val(selectedTab);
        },
        active: document.getElementById('<%= hdnSelectedTab.ClientID %>').value
    });
});

Опция 'selected' заменяется на 'active' ... Конечно, вам все равно нужно добавить скрытое поле:

<asp:HiddenField ID="hdnSelectedTab" runat="server" Value="0" />
4 голосов
/ 15 сентября 2010

Есть встроенная поддержка для jQuery cookie-плагина ( прямая загрузка ).Вы используете это следующим образом:

$("#tabs").tabs({
  cookie: { expires: 7 }  //1 week
});

Это не то же самое, что поддержка через обратную передачу, но обычно обеспечивает желаемый эффект.

2 голосов
/ 26 марта 2014

Попробуйте это:

Добавить на страницу:

<asp:HiddenField ID="hdnSelectedTab" runat="server" Value="0" />

Добавить к сценарию:

$(function () {
    var activeIndex = parseInt($get("hdnSelectedTab").value);
    $("#tabs").tabs({
        active: activeIndex,
        activate: function (event, ui) {
            $get("hdnSelectedTab").value = ui.newTab.index();
        }
    });
});
1 голос
/ 09 ноября 2013

Это решение сработало для меня: Источник http://saradesh.com/tajuddin/index.php/keep-the-selected-jquery-tab-active-on-partial-post-back-in-asp-net/

<script type="text/javascript">
        var selTab;
        $(function () {
            var tabs = $("#tabs").tabs({
                show: function () {
                    //get the selected tab index
                    selTab = $('#tabs').tabs('option', 'selected');

                }
            });

        });

    function pageLoad(sender, args) {

        if (args.get_isPartialLoad()) {

            $("#tabs").tabs({show: function () {
                    //get the selected tab index on partial postback
                    selTab = $('#tabs').tabs('option', 'selected');

                }, selected: selTab  });

        }
    };

    </script>
0 голосов
/ 15 сентября 2010

Я не парень .NET, но вы, вероятно, можете подключиться к событию submit () формы и отправить текущую активную вкладку на сервер с данными вашей формы. Таким образом, вы можете просто выбрать соответствующую вкладку на стороне сервера, когда вы на самом деле генерируете DOM и JS.

Что-то вроде ...

$("#the_form").submit(function(){
  var $form            = $(this);
      selected_tab_idx = $("#the_tabs").tabs( "option", "selected" );
  $('<input />', {type: hidden, name: 'tab_index', value: selected_tab_idx}).appendTo( $form );
  return true;
});
0 голосов
/ 15 сентября 2010

Вы можете получить текущую вкладку, выполнив следующее:

var selected = $tabs.tabs('option', 'selected');

Затем вы можете выбрать вкладку (после завершения процедуры POST), выполнив следующее:

$tabs.tabs('select', selected);

Обратите внимание, чтоВыбор вкладки осуществляется на основе индексации 0, поэтому выбор 2 означает выбор третьей вкладки.

...