problema de devolución de datos de pestañas jquery

Question

Estoy usando la biblioteca jquery en mi proyecto. Tengo un problema terrible con las pestañas jquery. La solución es que cuando estaba en la tercera pestaña, publico mi formulario, las pestañas se vuelven a cargar y va a la primera pestaña. Estoy buscando resolver el problema por mucho tiempo.

<script type="text/javascript">
    $(document).ready(function() {
        $("#example > ul").tabs({ remote: true, cache: true });
    });       
</script>

Entonces, ¿cómo resuelvo este problema? gracias a sus respuestas.

Answer 1

Las pestañas

pueden usar cookies para almacenar la pestaña actual. Eche un vistazo a las pestañas documentación . Abajo, en la lista de Opciones, hay un ejemplo de cómo usar cookies para almacenar la pestaña actual:

$('.selector').tabs({ cookie: { expires: 30 } });

Esto requiere que se incluya el jquery cookies plugin .

Answer 2

No especificó si está utilizando ASP.NET, pero si lo está, puede almacenar la pestaña seleccionada actualmente en un < asp: HiddenField / > en lugar de una cookie:

<script type="text/javascript" language="javascript">
    $(function() {
        $("#example").tabs({
            show: function() {
                var sel = $('#example').tabs('option', 'selected');
                $("#<%= hidLastTab.ClientID %>").val(sel);
            },
            selected: <%= hidLastTab.Value %>
        });
    });
</script>
<asp:HiddenField runat="server" ID="hidLastTab" Value="0" />

Si no es ASP.NET, probablemente podría hacer algo similar.

Answer 3

Intenté usar la solución publicada por joelsand. Sin embargo, las opciones y eventos de jQuery Tabs han cambiado. La documentación actual se encuentra en http://api.jqueryui.com/tabs/ .

En lugar de " show " evento, utilicé el " activado " evento. En lugar de & Quot; seleccionado & Quot; opción, utilicé " active " opción. En lugar de un campo oculto, utilicé una variable de JavaScript (declarada fuera del UpdatePanel)

Answer 4

Tuve el mismo problema, solucionado agregando lo siguiente al controlador de eventos select de jquery tabs:

$("div.ui-tabs-panel").html("");

Elimina eficazmente todos los paneles existentes para evitar el apilamiento de formularios.