Choque en jquery

chichote · #1 (**permalink**) 30/03/2010, 13:54

Hola amigos de forosdelweb, tengo un problema con jquery, estoy utilizando un plugin para darle diseño a los formularios

http://www.dfc-e.com/metiers/multime...e/jqtransform/

ese es el plugin para los diseños de form, y aparte estoy utilizando un pequeño codigo para aparecer y desaparecer div.

hasta hay todo bien, el problema es cuando pongo un form con un select dentro del div que aparecer y desaparecer, al momento de hacer clic en el select para que me muestre las opciones, desaparece el div completo.

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Importar</title>
	<link rel="stylesheet" type="text/css" href="css/style.css" />
    <style type="text/css">
	<!--
	body {
		background:#FFFFFF;
		}
	-->
	</style>
    <link rel="stylesheet" href="js/jqtransformplugin/jqtransform.css" type="text/css" media="all" />
    
    <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="js/jqtransformplugin/jquery.jqtransform.js" ></script>
	
	<script language="javascript">
		$(function(){
			$('#form_car').jqTransform({imgPath:'js/jqtransformplugin/img/'});
		});
	</script>
    
    <script type="text/javascript">
		$(function()
			{
			$(".mostrar_est").click(function(event)
				{
				event.preventDefault();
				$("#caja_est").fadeIn();
				});
			
			
			$("#caja_est a").click(function(event)
				{
				event.preventDefault();
				$("#caja_est").fadeOut();
				});
			
		});
		
	</script>
</head>

<body>
	
    <div style="margin:20px auto; width:415px; overflow:hidden;">
    	
        <div style="border:1px solid #DBDBDB; width:85px; padding:5px 5px 0 0; float:left; margin-right:10px;">
        	<span style="float:left; border-top:1px solid #DBDBDB; background: #EFEFEF; text-align:center; padding:3px; width:100%"><a class="mostrar_est" style="cursor:pointer">Ingresar Alumnos</a></span>
        </div>
     </div>
    
    <div style="margin:50px auto; width:465px; overflow:hidden;">
        <div id="caja_est" style="display: none;">
            <span>Ingresar Alumnos</span> <a href="#" class="close">[x]</a>
            form action="#" method="post" name="form_car" id="form_car">
                Seleccione Año <br />
                <label><select name="ano" id="ano">
                  <option value="2010">2010</option>
                  <option value="2011">2011</option>
                </select></label><br />
                Semestre <br />
                <label><select name="semestre" id="semestre">
                  <option value="1">Primer Semestre</option>
                  <option value="2">Segundo Semestre</option>
                </select></label><br />
                <input name="" type="file" /><br />
                <input name="button" type="submit" class="boton" id="button" value="enviar" />
            </form>
        </div>
    </div>
</body>
</html>

Esa es mi duda, hay algo que choca, de hecho el plugin para darle diseño a los form, utiliza ul y li para crear los select y les da la animacion con jquery, es hay donde choca algo pero no se que es.

Saludos.

mayid · #2 (**permalink**) 30/03/2010, 16:58

Desaparece todo porque vos así lo estas declarando!

$("#caja_est").fadeOut();

En vez de seleccionar el div $("#caja_est") selecciona lo que quieras ocultar. Por ejemplo, los selects

$("#caja_est select").fadeOut();

chichote · #3 (**permalink**) 31/03/2010, 06:25

Cita:

Iniciado por mayid

Desaparece todo porque vos así lo estas declarando!

$("#caja_est").fadeOut();

En vez de seleccionar el div $("#caja_est") selecciona lo que quieras ocultar. Por ejemplo, los selects

$("#caja_est select").fadeOut();

con $("#caja_est").fadeOut(); le digo q desaparesca la caja con todo su contenido, eso lo tengo claro y es asi, esa es mi intencion, el problema es que el plugin para modificar el estilo de los form me desaparece la caja cuando hago clic en un select, voy a revisar el plugin, quizas pueda arreglar ese detalle.

Gracias.

Saludos