Como enlazar paginas .html .php y .js

summerblack · #1 (**permalink**) 15/01/2013, 14:11

Hola a todos, quisiera q alguien me ayudara con una consulta que tengo sobre como enlazar paginas con diferentes extensiones y asi creo solucionar un problema que me acongoja:

1. tengo una pagina llamada index.html en esta tengo un formulario hecho a punta de "<div>" con un par de campos de texto y un boton (vale aclarar q no puedo usar los form)

2. tengo una pagina llamada funcioneslib.php esta es una libreria en donde tengo funciones tales como guardar, buscar, eliminar y alli va la conexion a la BD, cada funcion le debe entrar parmetros:$tabla, $campo, $dato y con ellos realizar el query para la BD.

3. tengo otro archivo q es index.php aca deberia llamar las funciones de la libreria y tomar los datos necesarios mediante el metodo post.

4. por ultimo tengo un archivo ajax llamado ajax.js q tiene una funcion llamada guardarenBD() y otras para que no me recargue la pagina.

ahora bien, mi problema es como puedo enlazar de manera correcta todos estos archivos? lo que tengo entendido es lo siguiente y quisiera que alguien me ayudara porq no funciona:

en index.html:
<input type='button' onclick='javascript:guardarenBD()' value='guardar' />
<script src="js/ajax.js" type="text/javascript"> </script>

en index.php
include("lib/funcioneslib.php");

en ajax.js
ajax.open("POST", "index.php",true);

pero no me funciona y creo que no esta bien como estoy haciendo el llamado en el archivo html. les agradeceria que alguien me ayudara con esto. Gracias!!

emprear · #2 (**permalink**) 15/01/2013, 14:24

@summerblack
Te dás cuenta que sin saber el código de cada archivo, es imposible saber que te falla, que tal si hay errores de sintáxis, por solo mencionar una posibilidad.
Las llamadas a los archivos, parecen estar correctas, si es que las rutas lo están.
Y que es eso de hacer un form pero no te dejan usar <form>

Saludos

summerblack · #3 (**permalink**) 16/01/2013, 13:04

bueno posteare el codigo y he hecho unos cambios reduciendo la cantidad de archivos muchas gracias si alguien me puede colaborar, la idea es que me guarde en la BD y me muestre los datos sin necesidad de formato en el div que dice "guardando".
*Lo de un formulario sin form es que quisiera saber como puedo remplazar la propiedad action sin necesidad de usar la etiqueta <form>

index.html

<html>
<head>
<meta charset="utf-8">
<title>Documento sin título</title>
</head>
<body>

<div id="Div1" >
<form action="javascript:guardarUsuario()" method="post">
<label for="documento"> Documento</label> <input name="documento" type="text" size="30" maxlength="30" tabindex="1">
<label for="expedicion">Expedición</label> <input name="expedicion" type="text" size="30"maxlength="30" tabindex="2">
</form>
</div>
<div id="guardando" >
aca va el contenido
</div>
<script src="js/ajax.js" type="text/javascript"> </script>
</body>
</html>

////////////////////////////////////////////////////////////////////////////////////////////////////////
funciones.php

<?php

$servidor ="servidor";
$username ="root";
$password ="pw";
$database ="db";

$con = mysql_connect($servidor, $username, $password) or die("Problema al conectar con la BD");
mysql_select_db($database, $con)or die("Problema con la BD");

//variables

if (isset($_POST['documento']) && !empty ($_POST['documento']) && isset($_POST['expedicion']) && !empty($_POST['expedicion'])){

$tabla= 'usuarios';
$campo1= 'Documento';
$campo2= 'Expedicion';
$dato1 = $_POST['documento'];
$dato2 = $_POST['expedicion'];

//Agregar datos a una tabla

function addItem($tabla, $campo1, $campo2, $dato1, $dato2) {
$query = "INSERT INTO " . $tabla . " (" . $campo1 . "," . $campo2 . ") VALUES('{$dato1}' , '{$dato2}')";
$result = mysql_query($query);
if($result){
echo '<script type="text/javascript">alert("Usuario registrado correctamente");</script>';
} else{
echo '<script type="text/javascript">alert("Error al registrar el usuario");</script>';
}
}
}
?>

//////////////////////////////////////////////////////////////////////////////////////////////////////////

ajax.js

function Ajax(){
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;
}

function guardarUsuario()
{
var guardando = document.getElementById('guardando');
guardando= '<img src="img/loading.gif">';
var documento= encodeURI(document.getElementByName('documento').v alue);
var expedicion = encodeURI(document.getElementByName('expedicion'). value);
var ajax = Ajax();
ajax.open("POST", "funciones.php",true);
ajax.onreadystatechange=guardarUsuarioBD;
ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
ajax.send("documento="+documento+"&expedicion="+ex pedicion)
}
function guardarUsuarioBD() {
if (ajax.readyState==4){
if (http_request.status == 200) {
guardando.innerHTML= ajax.responseText;
LimpiarCampos();
} }

}

function LimpiarCampos(){
document.getElementsByName("documento").value="";
document.getElementsByName("expedicion").value="";

}