dejar seleccionada una opción de una lista ul

[Pelirr]

Hola, tengo una pantalla con 4 pestañas, y al hacer cambios en ella y darle a guardar, se refresca la pantalla con los nuevos datos. Lo que quiero es que si hago cambios en la pestaña numero dos, al darle a guardar los cambios quiero que al refrescarse la pantalla me siga mostrando los datos de esa pestaña. Sin embargo, siempre que guardo cambios, al refrescar, me muestra la pantalla con los datos de la primera pestaña. Me gustaría saber como hacer para que cuando guarde cambios no me cambie de pestaña. Estoy utilizando una página jsp, que al pulsar el botón guardar me remite al método execute de un Action, y ese método me remite de nuevo a la página jsp.

Parte del código es el siguiente:

...
<!-- Para sacar pestañas en Pantalla parametros-->
<div id="TabbedPanels1" class="TabbedPanels">
<ul id="listaElecciones" class="TabbedPanelsTabGroup">
<li class="TabbedPanelsTab" tabindex="0"><s:text name="actividades"/></li>
<li class="TabbedPanelsTab" tabindex="0"><s:text name="incidencias"/></li>
<li class="TabbedPanelsTab" tabindex="0"><s:text name="rutasplanificadas"/></li>
<li class="TabbedPanelsTab" tabindex="0"><s:text name="actividadesEspeciales"/></li>
</ul>
<div class="TabbedPanelsContentGroup">

<div class="TabbedPanelsContent">...

mi idea era que al pulsar el botón de guardar se pasara al action una variable con un valor diferente según la pestaña en cuestión, y luego al volver del Action de nuevo a la jsp, recoger ese valor, y según el mismo, dejar seleccionada una pestaña u otra. Consigo pasar ese valor y recogerlo en el Action, pero no sé como a partir de ese valor dejar seleccionada una de las pestañas en particular: por ejemplo, estoy en la pestaña incidencias, guardo un cambio, dandole al botón aceptar, se guarda bien, se refresca la pantalla, pero me muestra el contenido de la pestaña actividades, y eso es lo que quiero que me cambie, que si estoy trabajando con el contenido de una pestaña, al refrescar, me siga mostrando el contenido de esa pestaña, no el contenido de la primera.

Sé que si fuera un select sería algo parecido a document.form.select[i].selected =true, pero con los elementos li de la lista ul no sé como hacerlo.

¿Puede alguien echarme un cable? Muchas gracias,

un saludo

[hector2c]

lo mas adecuado (en si, no pude leer correctamente todo lo escrito por tiempo)... es trabajar con ajax... cosa que no refrescas toda la pagina, y envias los datos asincronamente... te recomendaría usar jquery... saludos...

[Pelirr]

Hola, gracias por la sugerencia, pero el problema no es que la página se refresque, realmente lo hace todo bien, sólo que al volver a cargar la página muestra siempre los datos de la primera pestaña, y yo lo que quiero es que siga mostrando los datos de la pestaña con la que esté trabajando. Estoy investigando, y creo que tiene que ver con la parte tabindex="0" de la etiqueta <li>, pero todavía no sé como hacerlo. Cualquier ayuda sería bienvenida.

Muchas gracias, y un saludo

[Pelirr]

Mirando, mirando, resulta que al final todo va a tener que ver con el archivo SpryTabbedPanels.js, que contiene lo siguiente:

var Spry;
if (!Spry) Spry = {};
if (!Spry.Widget) Spry.Widget = {};

Spry.Widget.TabbedPanels = function(element, opts)
{
this.element = this.getElement(element);
this.defaultTab = 0; // Show the first panel by default.
this.bindings = [];
this.tabSelectedClass = "TabbedPanelsTabSelected";
this.tabHoverClass = "TabbedPanelsTabHover";
this.tabFocusedClass = "TabbedPanelsTabFocused";
this.panelVisibleClass = "TabbedPanelsContentVisible";
this.focusElement = null;
this.hasFocus = false;
this.currentTabIndex = 0;
this.enableKeyboardNavigation = true;

Spry.Widget.TabbedPanels.setOptions(this, opts);

// If the defaultTab is expressed as a number/index, convert
// it to an element.

if (typeof (this.defaultTab) == "number")
{
if (this.defaultTab < 0)
this.defaultTab = 0;
else
{
var count = this.getTabbedPanelCount();
if (this.defaultTab >= count)
this.defaultTab = (count > 1) ? (count - 1) : 0;
}

this.defaultTab = this.getTabs()[this.defaultTab];
}

// The defaultTab property is supposed to be the tab element for the tab content
// to show by default. The caller is allowed to pass in the element itself or the
// element's id, so we need to convert the current value to an element if necessary.

if (this.defaultTab)
this.defaultTab = this.getElement(this.defaultTab);

this.attachBehaviors();
};

entre otras cosas. De ahí que supongo que podría cambiar algo con una función javascript al hacer la llamada
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
cambiando algún elemento, porque lo que hace que se vea el contenido de una pestaña creo que es TabbedPanelsContentVisible. ¿Alquien se ha pegado ya con ésto?

Muchas gracias, un saludo

[Pelirr]

Hola, al final encontré la solución, la pongo por si alguien tuviera el mismo problema:

La solución ha sido crear una función javascript por cada botón de guardar de cada pestaña, y llamarla al apretar el botón, de manera que se guardara un valor y llegara al Action. Después, al volver a cargarse la página, se recoge ese valor (diferente para cada pestaña) y según sea uno u otro, hacer que se muestre el contenido de una pestaña u otra utilizando la expresión
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
que ya comenté. Es decir que en mi jsp introduje lo siguiente:

<!-- valor pasado al action para discriminar entre las distintas pestañas -->
<s:hidden id="pestanaElegida" name="pestanaElegida" value="%{pestanaElegida}"/>


<script type="text/javascript">
//Para que permanezca activado el contenido de la pestaña en la que se encuentra el cliente
var num = parseInt(document.getElementById('pestanaElegida') .value);
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1", { defaultTab: num});
function pestanaActividad()
{
document.getElementById('pestanaElegida').value = "0";
}
function pestanaIncidencias()
{
document.getElementById('pestanaElegida').value = "1";
}
function pestanaRutas()
{
document.getElementById('pestanaElegida').value = "2";
}
function pestanaActividadEspecial()
{
document.getElementById('pestanaElegida').value = "3";
}
</script>

y en los botones, pestanaActividad(), pestanaIncidencias(), etc.

Un saludo