Estoy haciendo una aplicación web para gestionar el producto SKUS. Una parte de eso es asociar SKU con nombres de productos. En cada fila de una tabla, enumero un SKU y visualizo un<select> Caja con nombres de productos. El producto que está asociado actualmente con ese SKU en la base de datos recibe un atributo comoselected="selected". Esto se puede cambiar y actualizar a través de AJAX.

Hay unmucho de producto<option>s - 103 para ser exactos - y esta lista se repite en el<select> en cada fila

Desde otra entrada en la página, estoy usando las solicitudes de jQuery AJAX para agregar nuevas asociaciones de producto / SKU, y para dejar en claro que se agregan al instante, las inserto en elparte superior De la mesa con un poco de efecto resaltado. A medida que aumenta el número de SKU más allá de los 10, si actualizo la página (que carga todo lo que sale de la base de datos ordenada por el nombre del producto), Firefox comienza a mostrar algunas opciones incorrectas como se seleccionó de forma predeterminada. No es coherente con respecto a la opción incorrecta que muestra, pero parece estar mezclando las opciones que existían antes de la recarga de la página.

Si inspecciono el<select> usando Firebug, elselect="selected" está en el correcto<option> etiqueta. Actualizar la página (o dejar y escribir la URL de esta página para regresar) no hace que se muestre correctamente, perorefrescante (Ctrl + F5) hace.

Tanto Chrome como IE7 muestran esto correctamente en primer lugar.

Mi teoría es que esto es el resultado de una estrategia de caché defectuosa de Firefox. ¿Eso suena bien? ¿Hay alguna manera de que pueda decir en mi código "si esta página se actualiza, actualícelo, vuelva a cargar todo desde cero?"

Actualizar

Para resolver este problema, cambié de estrategia.

Anteriormente, puse un<select> con una larga lista de<option>s en cada fila de la tabla, con el valor actual establecido como predeterminadoAhora, pongo el valor actual en una<span>. Si el usuario hace clic en el botón "cambiar", reemplazo el<span> con un<select>, y el botón "cambiar" se convierte en un botón "confirmar". Si cambian las opciones y hacen clic en confirmar, AJAX actualiza la base de datos, la y la<select> vuelve a ser un<span>, esta vez con el nuevo valor.

Esto tiene dos beneficios:

Corrige el error descrito anteriormente.Requierelejos Menos elementos DOM en la página (todos los redundantes<option>s)