PHP - Inserción de datos mediante formulario en ventana TinyBox

   
Vista:

Inserción de datos mediante formulario en ventana TinyBox

Publicado por Javi (2 intervenciones) el 24/10/2013 13:06:35
Hola buenas,
tengo una página muy simple que muestra una tabla (jQuery DataTables) con datos de una base de datos, por ejemplo tabla.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
<?php require_once('conexion.php');
$cn=  Conectarse();
$listado=  mysql_query("select * from datos",$cn);
?>
 
<script type="text/javascript" language="javascript" src="js/jslistado.js"></script>
<script type="text/javascript" language="javascript" src="js/tinybox.js"></script>
<script type="text/javascript">
	T$('popupNuevoDato').onclick = function(){TINY.box.show('formulario/formulario.php',1,741,150,1)}
</script>
 
<a id="popupNuevoDato"><img src="images/add.png" title="A&ntilde;adir nuevo dato"></a>
<table cellpadding="0" cellspacing="0" border="0" class="display" id="tabla_lista">
	<thead>
		<tr>
			<th>Nombre</th>
			<th>Apellido</th>
		</tr>
	</thead>
	<tbody>
		<?php
		while($reg=  mysql_fetch_array($listado))
		{
		echo '<tr>';
		echo '<td>'.mb_convert_encoding($reg['nombre'], "UTF-8").'</td>';
		echo '<td>'.mb_convert_encoding($reg['apellido'], "UTF-8").'</td>';
		echo '</tr>';
		}
		?>
	<tbody>
	<tfoot>
		<tr>
			<th></th>
			<th></th>
		</tr>
	</tfoot>
</table>

A parte tengo otra página con un simple formulario, por ejemplo formulario.php, que al hacer submit introduce los datos del formulario en la base de datos, de modo que refrescar la página tabla.php ya aparecería los nuevos datos recién introducidos.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<html>
<head>
<title>Registro de datos</title>
<script language="JavaScript" type="text/javascript" src="ajax.js"></script>
</head>
<body>
<form name="nuevo_dato" action="" onsubmit="enviarDatos(); return false">
<table>
	<tr>
		<td>Nombre</td><td><label><input name="nombre" type="text" /></label></td>
		<td>Apellido</td><td><label><input name="apellido" type="text"></label></td>
	</tr>
	<tr>
		<td>&nbsp;</td><td><label><input type="submit" name="Submit" value="Grabar" /></label></td>
	</tr>
</table>
</form>
</body>
</html>

Hasta aquí todo ok y funcionando, si lo hago de este modo funciona, una página para introducir los datos con éxito y otra que me muestra los datos ya introducidos, cada una por separado en el navegador.

El problema es cuando quiero mostrar la página formulario.php en una ventanita TinyBox, aparentemente todo funciona bien, pero no añade nada a la base de datos. Este es el contenido del archivo ajax.js:

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
function objetoAjax(){
	var xmlhttp=false;
	try {
		xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
	} catch (e) {
	try {
		xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
	} catch (E) {
		xmlhttp = false;
	}
}
 
if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
	  xmlhttp = new XMLHttpRequest();
	}
	return xmlhttp;
}
 
//Función para recoger los datos del formulario y enviarlos por post  
function enviarDatos(){
 
  //div donde se mostrarán los resultados
  divResultado = document.getElementById('resultado');
  //recogemos los valores de los inputs
  nombre=document.nuevo_dato.nombre.value;
  apellido=document.nuevo_dato.apellido.value;
 
  //instanciamos el objetoAjax
  ajax=objetoAjax();
 
  //uso del medoto POST
  //archivo que realizará la operación
  //registro.php
  ajax.open("POST", "registro.php",true);
  //cuando el objeto XMLHttpRequest cambia de estado, la función se inicia
  ajax.onreadystatechange=function() {
	  //la función responseText tiene todos los datos pedidos al servidor
  	if (ajax.readyState==4) {
  		//mostrar resultados en esta capa
		divResultado.innerHTML = ajax.responseText
  		//llamar a funcion para limpiar los inputs
		LimpiarCampos();
	}
 }
	ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
	//enviando los valores a registro.php para que inserte los datos
	ajax.send("nombre="+nombre+"&apellido="+apellido)
}
 
//función para limpiar los campos
function LimpiarCampos(){
  document.nuevo_dato.nombre.value="";
  document.nuevo_dato.apellido.value="";
  document.nuevo_dato.nombre.focus();
}

Tiene una función enviarDatos() que lo que hace es enviar los datos a otro archivo llamado registro.php donde finalmente se hace el INSERT, y su código es:

1
2
3
4
5
6
7
8
9
10
11
<?php require_once('../libs/conexion.php');
$cn=Conectarse();
 
//variables POST
  $host=$_POST['nombre'];
  $ent=$_POST['apellido'];
 
//registra los datos
  $sql="INSERT INTO datos (nombre, apellido) VALUES ('$nombre', '$apellido')";
  mysql_query($sql,$cn) or die('Error. '.mysql_error());
?>


Alguien sabría decirme por qué si abro en un navegador la página registro.php y relleno el formulario SI se graban los datos en la base de datos, y si lo hago desde la ventanita TinyBox NO hace nada?


Un saludo y gracias de antemano.
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