Iniciar sesiónCerrar
Correo:
Contraseña:
Entrar
Recordar sesión en este navegador
Iniciar sesiónIniciar sesiónCrear cuentaCrear cuenta
LWP » Foros » JQuery » Problema Jquery + Ajax + php + botones creados dinamicamente

JQuery - Problema Jquery + Ajax + php + botones creados dinamicamente

Volver
Nuevo Tema
<<>>
 
Vista:

Problema Jquery + Ajax + php + botones creados dinamicamente

Publicado por jmboni (2 intervenciones) el 17/02/2012 10:14:22
Hola buenos dias
Tengo el siguiente problema.

Tengo un select en html en el cual al cargar el dom el selected es el mes actual y segun ese dato mediante ajax en php busco en una base de datos sqlite y genero con php unos botones donde aparecen los eventos de ese mes, tantos botones como eventos.
Esos botones los cargo mediante ajax en el index html.
Estos botones se generan cada vez que cambio el mes en el select.
El problema lo tengo que cuando pincho en alguno de los botones, mediante ajax otra vez cargo en un div los datos correspondientes al dia de ese boton.
Mi problema es que quiero que cuando aparezcan los datos en este ultimo div al pulsar el boton aparezcan con algun efecto de jquery.
Pero no me fuciona ninguna funcion de click con jquery para hacer aparecer el div donde meto los datos del dia con algun efecto.
Alguien me podria ayudar
Muchas gracias
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de xve
Val: 302
Oro
Ha mantenido su posición en JQuery (en relación al último mes)
Gráfica de JQuery

Problema Jquery Ajax php botones creados dinamicamente

Publicado por xve (673 intervenciones) el 17/02/2012 15:31:09
Hola jmboni, sin ver el código, es muy difícil de ayudarte, pero yo alguna vez he utilizado los efectos slideDown() y slideUp() y no tienen mayor problema... no se a que efectos te refieres, pero aquí te adjunto un ejemplo de la web de jquery.

1
2
3
$("#flip").click(function(){
   $("#panel").slideDown();
});

Cuando se pulsa sobre el id flip hace el efecto de bajar el div con el id panel
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Problema Jquery Ajax php botones creados dinamicamente

Publicado por jmboni (2 intervenciones) el 17/02/2012 16:45:52
Adjunto codigo.
Ahora estoy aprendiendo php5 y estoy haciendo pruebas para ver como funciona ajax, jquery, php etc.
Por lo tanto el codigo no es lo mas correcto.
Tambien me gustaria saber como marcar los dias del calendario que coincidan con algun evento con otro fondo o estilo distinto.

El codigo seria el siguiente:

INDEX.HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
<html>
<head>
<style>
#calendariofiscal{

	width:800px;
	margin:0 auto;
}
#calendariofiscal h1{

	text-align:center;
}
 
#resultado{

	float:left;
	width:475px;
	margin:5px 0px 0px 0px;
	border-top: 2px dashed #9999ff;

}
#ver{

	margin:5px;
	position:relative;
	float:left;
}
.texto{
	font-weight:bold;
}
</style>
<title>Calendario Fiscal</title>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  <script type="text/JavaScript" src="jquery-1.7.js"></script>
  <script type="text/JavaScript" src="jqueryui.js"></script>
 
  <script type="text/javascript">
	function muestraevento(str){
		var xmlhttp;
		if (str=="")
		  {
		  document.getElementById("txtHint").innerHTML="";
		  return;
		  }
	  if (window.XMLHttpRequest)
		  {// code for IE7+, Firefox, Chrome, Opera, Safari

		  xmlhttp=new XMLHttpRequest();
		  }
		else
		  {// code for IE6, IE5

		  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
		  }
		xmlhttp.onreadystatechange=function()
		  {
		  if (xmlhttp.readyState==4 && xmlhttp.status==200)
			 {
			 document.getElementById("ver").innerHTML=xmlhttp.responseText;
			 }
		  }
		xmlhttp.open("GET","hola2.php?c="+str,true);
		xmlhttp.send();
	}
	</script>
	<script language="javascript" type="text/javascript">
		<!-- con esta funcion esperamos a que cargue la pagina -->
	    $(document).ready(function(){
			<!-- variables para ver la feha y el mes -->
			var fechaAct= new Date();
			var mes= fechaAct.getMonth();
			fechaAct= new Date();
			mes= fechaAct.getMonth();
			meses= new Array("Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","Diciembre");
			<!-- document.prueba.dia_recogida.options[dia].selected= true; -->
			document.seleccion.miSelect.options[mes].selected= true;
			<!-- document.prueba.any_recogida.options[anyo].selected= true; -->
			muestraevento(mes+1);
		});
 
	</script>
<script type="text/javascript">
function ajaxget(variable){
	var conexion;
	if (window.XMLHttpRequest)
	  {
	  conexion=new XMLHttpRequest();
	  }
	else
	  {
	  conexion=new ActiveXObject("Microsoft.XMLHTTP");
	  }
	conexion.onreadystatechange=function()
	  {
	  if (conexion.readyState==4 && conexion.status==200)
		{
		document.getElementById("resultado").innerHTML=conexion.responseText;
	    }
	  }
	conexion.open("GET","Evento.php?variable="+variable,true);
	conexion.send();
}
</script>
</head>
<body>
<div id="calendariofiscal">
	<h1>Calendario Fiscal</h1>
	<fieldset class="marco">
	<legend class="texto" align= "left" >Selecciona un mes para ver sus eventos</legend>
		<form name="seleccion" action="">
					<select id="listameses" name="miSelect" onchange="muestraevento(this.value)">
						<option value="1">Enero</option>
						<option value="2">Febrero</option>
						<option value="3">Marzo</option>
						<option value="4">Abril</option>
						<option value="5">Mayo</option>
						<option value="6">Junio</option>
						<option value="7">Julio</option>
						<option value="8">Agosto</option>
						<option value="9">Septiembre</option>
						<option value="10">Octubre</option>
						<option value="11">Noviembre</option>
						<option value="12">Diciembre</option>
					</select>
				</form>
		<div id="ver"></div>
	</fieldset>
</div>
</body>
</html>



EVENTO.PHP

<html>
<head>
<style>

.eventodia{
float:left;
width:475px;
margin:5px 0px 0px 0px;
font-size:12px;
border-bottom: 1px solid #9999ff;
text-align:justify;
word-spacing:pre-wrap;
}
.titular{
font-size:20px;
text-align:center;
font-weight:bold;
}
</style>
<?
//Array para pasar el valor del mes a texto
$meses = Array ('Enero','Febrero','Marzo','Abril','Mayo','Junio','Julio','Agosto','Septiembre','Octubre','Noviembre','Diciembre');
?>
</head>
<?php

//Cogemos las variable del formulario
$enlace=($_GET['variable']);

//Creamos una instancia a la base datos
$basedatos=new SQliteDatabase("calendario.db");

//Creamos la consulta a la tabla
$consulta = "SELECT * FROM Eventos where enlace='$enlace';";

//Generamos el resultado segun la consulta a la base de datos
$resultado=$basedatos->query($consulta);


//Valid() si hay registros sin mostrar true sino false(todas las filas extraidas)
$fila2=$resultado->current();
$mes=$fila2['Mes'];
$mestexto=$meses["$mes"-1];
echo '<p class="titular">'.$fila2['Dia']." de ".$mestexto.'</p>';
while($resultado->valid()){

//Aqui nos da el valor por filas
$fila=$resultado->current();
echo '<p class="eventodia">- '.$fila['Evento'].'</p></br>';
//Aqui pasamos al siguiente registro
$resultado->next();
}
?>
</body>
</html>


HOLA2.PHP

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
<html>
<head>
<style>
#fecha{

	float:left;
	width:250px;
	margin-right:5px;
}
#even{

	float:right;
	margin:0px;
	width:500px;
}
</style>
 
</head>
<?php
 
//Cogemos las variable del formulario

$mes=($_GET['c']);
?>
<div id="fecha">
	<?php include 'calendarioNuevo.php';?>
</div>
<div id="even">
	<?php
		//Creamos una instancia a la base datos

		$basedatos=new SQliteDatabase("calendario.db");
		//$basedatos2=new SQliteDatabase("calendario.db");

 
		//Creamos la consulta a la tabla

		$consulta2 = "SELECT * FROM Eventos where Mes='$mes' group BY Dia order by Dia;";
 
		//Generamos el resultado segun la consulta a la base de datos

		$resultado2=$basedatos->query($consulta2);
	?>
	<fieldset class="cuadroevento">
	 <legend class="texto" align= "left" >Eventos por dias</legend>
		<?php
			//Valid() si ha registros sin mostrar true sino false(todas las filas extraidas)

			while($resultado2->valid()){
 
					//Aqui nos da el valor por filas

					$fila2=$resultado2->current();
					$dia=$fila2['Dia'];
 
					//Creamos botones para los dias

				echo '<input name="'.$dia.$meses["$mes"-1].'" onclick="ajaxget(this.name)" type="button" value="'.$dia." de ".$meses["$mes"-1].'" id="'.$dia.'" class="enviar">';
			$resultado2->next();
			}
		?>
		<div id="resultado"></div>
	</fieldset>
</div>
</body>
</html>



CALENDARIONUEVO.PHP

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
<html>
<head>
<?
$funcionTratarFecha = 'document.location = "?dia="+dia+"&mes="+mes+"&ano="+ano;';
 
//Array para pasar el valor del mes a texto

$meses = Array ('Enero','Febrero','Marzo','Abril','Mayo','Junio','Julio','Agosto','Septiembre','Octubre','Noviembre','Diciembre');
$mestexto=$meses["$mes"-1];
 
?><script>
function tratarFecha(dia,mes,ano){
  echo $dia;
  echo $mes;
  echo $ano;
}
</script>
<style>
.dias {
   font-family:MS Sans Serif;
   font-size:10pt;
   width:200px;
}
 
a {
   text-decoration:none;
   color:#000000;

}
 
#almanaque{

	float:left;
	width:200px;
	margin-right:15px;
}
.formulario{
	float:left;
	margin:10px;
}
.cuadro{
	width:100%;
}
 
</style>
</head>
<body>
<div id="almanaque">
	<fieldset class="cuadro">
		<legend class="texto" align= "left" >Calendario</legend>
		<form class="formulario">
				<?
					$fecha = getdate(time());
					if(isset($_GET["dia"]))$dia = $_GET["dia"];
					else $dia = $fecha['mday'];
					if(isset($_GET["ano"]))$ano = $_GET["ano"];
					else $ano = $fecha['year'];
					$fecha = mktime(0,0,0,$mes,$dia,$ano);
					$fechaInicioMes = mktime(0,0,0,$mes,1,$ano);
					$fechaInicioMes = date("w",$fechaInicioMes);
					?>
				<table class="dias" border="0" cellpadding="5" cellspacing="5" width="100%" class="m1" bgcolor="#FFFFFF" height="20%" rules="rows" frame="void">
				<?
					$diasSem = Array ('L','M','M','J','V','S','D');
					$ultimoDia = date('t',$fecha);
					$numMes = 0;
					for ($fila = 0; $fila < 7; $fila++){
						echo "      <tr>\n";
						for ($coln = 0; $coln < 7; $coln++){
						$posicion = Array (1,2,3,4,5,6,0);
						echo '        <td width="14%" height="0"';
						if($fila == 0)echo ' bgcolor="#808080"';
						//if($dia-1 == $numMes)echo ' bgcolor="#0A2fff"';

						echo " align=\"center\">\n";
						echo '        ';
						if($fila == 0)echo '<font color="#D4D0C8">'.$diasSem[$coln];
						elseif(($numMes && $numMes < $ultimoDia) || (!$numMes && $posicion[$coln] == $fechaInicioMes)){
						  echo '<a href="#" onclick="tratarFecha('.(++$numMes).','.$mes.','.$ano.')">';
						  if($dia == $numMes)echo '<font color="red">';
						  echo ($numMes).'</a>';
						}
						echo "</td>\n";
					  }
					  echo "      </tr>\n";
					}
				?>
				</table>
		</form>
	</fieldset>
</div>
</body>
</html>



La base de datos se llama calendario.db y tiene 4 campos es en sqlite2

La tabla se llama eventos
Columna Tipo
Evento char(255)
Mes char(50) NULL
Dia integer NULL
enlace varchar(50) NULL

Si precisas los archivos dime un correo y te los mando para que los veas.

El problema es que genero botones segun el mes hay dias con eventos y genero un boton por evento.
Al pulsar sobre ese boton ejecuto otra funcion

ajaxget(variable)

Con la cual mediante ajax extraigo de la base de datos los eventos de un dia y los introuzco dentro de un div pero querria que al pulsar sobre uno de esos botones el div aparezca con efecto.

Adjunto registros base de datos con los que estoy probando

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('RENTA',	'1',	2,	'2Enero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('I.V.A',	'1',	2,	'2Enero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('RENTA Y SOCIEDADES',	'1',	20,	'20Enero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('I.V.A',	'1',	20,	'20Enero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('SUBVENCIONES, INDEMNIZACIONES O AYUDAS DE ACTIVIDADES AGRÍCOLAS, GANADERAS O FORESTALES',	'1',	20,	'20Enero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('IMPUESTOS ESPECIALES DE FABRICACIÓN',	'1',	20,	'20Enero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('IMPUESTO ESPECIAL SOBRE EL CARBÓN',	'1',	20,	'20Enero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('IMPUESTO SOBRE VENTAS MINORISTAS DE DETERMINADOS HIDROCARBUROS',	'1',	20,	'20Enero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('IMPUESTO SOBRE LAS PRIMAS DE SEGUROS',	'1',	20,	'20Enero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('OPERACIONES CON ACTIVOS FINANCIEROS',	'1',	20,	'20Enero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('RENTA',	'1',	30,	'30Enero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('DECLARACIÓN INFORMATIVA DE DETERMINADOS PREMIOS EXENTOS DEL IRPF',	'1',	30,	'30Enero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('PLANES, FONDOS DE PENSIONES, SISTEMAS ALTERNATIVOS, MUTUALIDADES DE PREVISIÓN SOCIAL, PLANES DE PREVISIÓN ASEGURADOS, PLANES INDIVIDUALES DE AHORRO SISTEMÁTICO, PLANES DE PREVISIÓN SOCIAL EMPRESARIAL Y SEGUROS DE DEPENDENCIA',	'1',	30,	'30Enero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('RENTA Y SOCIEDADES',	'1',	31,	'31Enero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('I.V.A',	'1',	31,	'31Enero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('DECLARACIÓN INFORMATIVA DE PRÉSTAMOS Y CRÉDITOS Y OTRAS OPERACIONES FINANCIERAS RELACIONADAS CON BIENES INMUEBLES',	'1',	31,	'31Enero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('DONATIVOS, DONACIONES Y APORTACIONES RECIBIDAS Y DISPOSICIONES REALIZADAS',	'1',	31,	'31Enero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('DECLARACIÓN INFORMATIVA DE ADQUISICIONES Y ENAJENACIONES DE ACCIONES Y PARTICIPACIONES EN INSTITUCIONES DE INVERSIÓN COLECTIVA',	'1',	31,	'31Enero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('OPERACIONES CON ACTIVOS FINANCIEROS',	'1',	31,	'31Enero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('NÚMERO DE IDENTIFICACIÓN FISCAL',	'1',	31,	'31Enero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('RENTA Y SOCIEDADES',	'2',	20,	'20Febrero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('I.V.A',	'2',	20,	'20Febreo');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('IMPUESTO SOBRE LAS PRIMAS DE SEGURO',	'2',	20,	'20Febrero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('IMPUESTOS ESPECIALES DE FABRICACIÓN',	'2',	20,	'20Febrero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('NÚMERO DE IDENTIFICACIÓN FISCAL',	'2',	20,	'20Febrero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('PLANES, FONDOS DE PENSIONES, SISTEMAS ALTERNATIVOS, MUTUALIDADES DE PREVISIÓN SOCIAL, PLANES DE PREVISIÓN ASEGURADOS, PLANES INDIVIDUALES DE AHORRO SISTEMÁTICO, PLANES DE PREVISIÓN SOCIAL EMPRESARIAL Y SEGUROS DE DEPENDENCIA',	'2',	20,	'20Febrero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('SUBVENCIONES, INDEMNIZACIONES O AYUDAS DE ACTIVIDADES AGRÍCOLAS, GANADERAS O FORESTALE',	'2',	20,	'20Febrero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('IMPUESTO SOBRE SOCIEDADES',	'2',	29,	'29Febrero');
INSERT INTO "eventos" ("Evento", "Mes", "Dia", "enlace") VALUES ('DECLARACIÓN ANUAL DE CONSUMO DE ENERGÍA ELÉCTRICA',	'2',	29,	'29Febrero');
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar