interferencia de contenido de jquery-ui-tabs

Question

Estoy usando jquery-ui-tabs para permitir a los usuarios crear sus propias pestañas, luego, por supuesto, cambiar entre las pestañas como mejor les parezca. El contenido en los widgets son pequeños widgets que son como mini programas por derecho propio. Los usuarios pueden elegir qué widgets quieren en cualquier pestaña determinada.

Esto funciona bien siempre que cualquier widget determinado solo se configure en 1 pestaña, sin embargo, las cosas comienzan a ir mal cuando un widget dado se agrega a 2 pestañas o más. Cuando se generan los widgets, usan el ID de la base de datos. Por ejemplo . Si un widget dado se agrega a 2 o más pestañas, terminan con 2 divs con la misma id de id, por ejemplo widget_1, que causa problemas como se puede imaginar.

Así que mi pregunta es, ¿cuál es la mejor manera de resolver ese problema?

Desearía saber antes que querían poder usar el mismo widget en más de 1 pestaña. Me da la sensación de esto es casi va a tener que ser una reescritura completa ...

Answer 1

qué el "div llamado div1" tienen "div1" como clase o ID ?

suena su pregunta como si fuera un Identificación, y eso es todo el problema: the id has to be unique

Para solucionar esto, el trabajo con las clases - que se puede utilizar varias veces y usted debería ser capaz de hacer exactamente las mismas cosas (pero eso es un poco difícil de decir sin ver un código).

EDIT: cambió el enlace de mi puño para mostrar la recomendación w3c. conecté this article antes de

Answer 2

No es una práctica recomendada tener el mismo id en la misma página, pero no debería tener problemas con él, todo lo que necesita hacer en sus llamadas javascript es agregar la pestaña a sí mismo, por ejemplo:

$(".tab-1 #div1")... en lugar de solamente $("#div1")...

embargo, siempre se evitaría tener el mismo id y "contar" su generador de usar div1-random-number y utilice siempre la clase para obtener el widget mediante la ficha actualmente como se ve en el código anterior

Live example on JsBin