Comunidad de diseño web y desarrollo en internet online

Pasar variables de un formulario a otra página con Jquery

Citar            
MensajeEscrito el 02 Dic 2012 11:17 am
Bueno espero que me podais ayudar.
Tengo una página que utiliza un formulario para filtrar registros de una base de datos y en la misma página muestro el resultado de dicha consulta, la página funciona perfectamente.
El problema inicial es que cada vez que cambio algún valor del filtro me refresca toda la página y para evitar eso he decidido refrescar solo el div donde muestro el resultado de la consulta, para ello he creado una página nueva a la que llamo Pagina1.php que contiene solo la consulta y en la página inicial que se llama Coches.php mantengo el formulario de Filtrar y el div donde cargo la Pagina1.php cada vez que filtro.
Lo que no se hacer es como pasar los valores seleccionados del formulario que utilizo para filtrar en Coches.php a la nueva Pagina1.php que es donde se encuentra mi consulta, y no lo se hacer porque es la primera vez que utilizo Jquery.
¿Me podeis ayudar?

Este es el código de Coches.php:
Código:

Código PHP :

<script type='text/javascript' src='jquery-1.7.1.min.js'></script>
        <script type='text/javascript'>
        $(document).ready(function(){
    cargarContenido('Pagina1.php');
});
        </script>    
    <style type='text/css'>
        #contenido  { position: absolute; top: 184px; left: 200px; width:765px;height: 165px;}
        .clock      {position:relative;left:50%;top:50%;width:36px;height:36px;padding:20px;}
    </style>
   </head>
<?php
require_once('Connections/ConexionCoches.php');
$selciudad = isset($_GET["selciudad"])? $_GET["selciudad"]: '';
        $aireacond = isset($_GET["aireacond"])? $_GET["aireacond"]: '';
?>
<body>
<div id="DivContenedor">
<div id="Fondo">
<div id="DivFiltrado">
<form name="filtrar" id="filtrar" method="GET" action="Coches.php">
<table width="192" height="30" border="0">
<tr>
<td align="center">
    <select name="selciudad" id="selciudad" class="Guias3" Onchange="cargarContenido('Pagina1.php')">
    <option value="-1" selected>&nbsp;Todas las Ciudades&nbsp;&nbsp;</option>
    <?php
    $tablaciudad = mysql_query("SELECT * FROM provincias  ORDER BY Provincia ASC"); 
    while ($registrociudad  = mysql_fetch_array($tablaciudad ))
        if(empty($_GET['selciudad']))
{
  ($_GET['selciudad'] = '-1');
}elseif
  ($_GET["selciudad"]==$registrociudad['Provincia']) {
           echo "<option value='".$registrociudad['Provincia']."' selected>&nbsp;&nbsp;".$registrociudad['Provincia']."</option>";
       }else{
          echo "<option value='".$registrociudad['Provincia']."' >&nbsp;&nbsp;".$registrociudad['Provincia']."</option>";      }
    mysql_free_result($tablaciudad);
  
    ?>
</select>
</td>
</tr>
</table>
   <table width="184" border="0"  align="center" class="Guias3" rules="rows">
      <tr>
        <td align="left" height="22">
<?php
if (isset($_GET["aireacond"])){
    echo "<label><input type='checkbox' name='aireacond' id='aireacond'  value='1' checked onClick=\"cargarContenido('Pagina1.php')\"/> Aireacond</label>";
}else{
    echo "<label><input type='checkbox' name='aireacond' id='aireacond'  value='1' onClick=\"cargarContenido('Pagina1.php')\"/> Aireacond</label>";}
?>
       </td>
      </tr>
  
   </table>
</form>
</div>

    <div id='contenido'></div>
   
    <script type='text/javascript'>
    function cargarContenido(pagina)
    {
        // cargamos el icono en el div donde ira el contenido
        $("#contenido").html("<img src='clock.gif' class='clock' border='0' />");
        // cargamos la pagina Pagina1.php en el div contenido
        $("#contenido").load(pagina);
    }
    </script>
 </div> <!-- Cierro Fondo -->
</div><!-- Cierro DivContenedor -->
</body>


Esta es mi Pagina1.php con la que recargo el <div id='contenido'>:

Código:

Código PHP :

<?php
require_once('Connections/ConexionCoches.php');
?>

<?php
$sql = "SELECT SQL_CALC_FOUND_ROWS * FROM coches WHERE Activacion = '1'";

        if (isset($_GET['selciudad'])and $_GET['selciudad'] <>'-1') {
$sql .= "AND coches.Ciudad = '$selciudad' ";
   }else {$sql .= "AND coches.Ciudad <> '-1' ";
}
       if (isset($_GET['aireacond'])and $_GET['aireacond'] ='1') {
$sql .= "AND coches.Aireacond = '$aireacond' ";
   }else {$sql .= "AND (coches.Aireacond = '1' or coches.Aireacond = '0')";
}
        $sql .= 'LIMIT 0, 12' ;

        if (!($result = @mysql_query($sql))) {
  
            die(mysql_error()); } 
//Recuperar el número total de registros en la tabla
        $rows = mysql_fetch_assoc(mysql_query('SELECT FOUND_ROWS() AS rows'));
        
$tabla = mysql_query($sql);
while ($registro = mysql_fetch_array($tabla)) {
?>
 <div class="Prueba">
 <table class="MarcoFotoPrincipal" width="165" border="0">
  <tr>      
          <td><a href="<?php echo $registro['Url']; ?>"><img border="0" src="<?php echo $registro['FotoPrincipal']; ?>"></a></td>          
  </tr>
  </table>
<table width="165"  align="center" border="2"  bordercolor="#D6A64A">
  <tr>
    <td  align="center" class="Edad"><?php echo $registro['Edad']. "&nbsp;años&nbsp;/&nbsp;"; ?><?php echo $registro['Precio']. "&nbsp;€uros"; ?></td>
  </tr>
  <tr>
     <td  align="center" class="Ciudad"><?php echo $registro['Ciudad']; ?></td>
  </tr>
</table>
 </div>     
<?php
}
mysql_free_result($tabla);
?>



Por favor decidme como se hace.
Gracias a tod@s.

Por Unexes

8 de clabLevel



 

msie8
Citar            
MensajeEscrito el 02 Dic 2012 02:15 pm
Primero que nada, no necesitas ejecutar la llamada Ajax en el evento .ready(), como usas PHP, solo tienes que hacer:

Código PHP :

<div id='contenido'><?php require ("Pagina1.php"); ?></div>

porque la primera vez que se carga el listado, lo tienes que mostrar sí o sí.

Ahora bien, para el tema que te preocupa, en la función CargarContenido() usa .serialize() para pasarle a "Pagina1.php" los datos del formulario por GET:

Código Javascript :

    function cargarContenido(pagina)
    {
        // cargamos el icono en el div donde ira el contenido
        $("#contenido").html("<img src='clock.gif' class='clock' border='0' />");
        // cargamos la pagina Pagina1.php en el div contenido
        $("#contenido").load(pagina, $("#filtrar").serialize());
    }

Finalmente en "Pagina1.php" tomas esos datos en el array $_GET que supongo ya sabes cómo funciona :).

Por DriverOp

Claber

2510 de clabLevel



 

opera
Citar            
MensajeEscrito el 02 Dic 2012 09:55 pm
Gracias por tu ayuda y esfuerzo DriverOp.

Veras no se como tomar en mi Pagina1.php los datos en el array $_GET llevo poco tiempo en esto de programar y desconozco muchas cosas, lo que he hecho es lo siguiente al principio de mi Pagina1.php; y de esta forma aparentemente funciona bien, si no fuese así como hay que hacerlo me podrias decir como lo debo hacer.

Código PHP :

<?php
require_once('Connections/ConexionCoches.php');
$selciudad = $_GET['selciudad'];
$aireacond = isset($_GET["aireacond"]);
?>

Solo me ocurre una cosa las ciudades cuyo nombre contiene un acento (Castellón, Cáceres, etc...) me las pone bien la primera vez cuando entro a la página antes de filtrar nada, pero al filtrar por cualquier ciudad cuyo nombre tienen acento me pone cuadrados o signos raros en los lugares donde va la letra acentuada por lo tanto mi consulta no encuentra los coches de esas ciudades, si encuentra las de las ciudades que no lleván acento.
Otra cosa en el formulario filtrar tengo que poner muchos mas campos tanto selects como checkbox, supongo que lo unico que tengo que hacer es añadir esos campos a mi formulario y a mi consulta ¿hay algún problema por utilizar el metodo $_GET o es mejor cambiarlo todo a $_POST.

Bueno espero no abusar de tu ayuda, pero de verdad estaba totalmente atascado.

Un saludo y muchisimas gracias.

Por Unexes

8 de clabLevel



 

msie8
Citar            
MensajeEscrito el 03 Dic 2012 04:27 pm
Para enviar datos desde un formulario siempre es mejor POST porque de esa forma el navegador no registra la URL con los datos enviados en el historial. Pero para una petición Ajax eso es irrelevante porque el navegador no registra en el historial las peticiones Ajax.

Sobre el problema con los acentos, pues tienes razón. Una de las características de Ajax es que SIEMPRE se envía y se interpreta su respuesta en UTF-8 independientemente de cómo esté configurado el servidor. Como tu servidor no está configurado en UTF-8 debes forzar la codificación.

En "Pagina1.php", bien al principio, pon lo siguiente:

Código PHP :

if (!headers_sent()) {
   header("Content-Type: text/html; charset=UTF-8");
}

Eso hará el truco.

Lo que estás haciendo en Pagina1.php lo estás haciendo bien.

Por DriverOp

Claber

2510 de clabLevel



 

opera
Citar            
MensajeEscrito el 03 Dic 2012 07:23 pm
Gracias por tu respuesta y por tu tiempo DriverOp

Antes que nada te dire que ya respondi a tu post en el día de ayer pero no se por que razón no aparece mi respuesta así que es posible que salgan 2 respuestas en lugar de una, si así fuera lo siento.

Veras la solución que me diste aparentemente funciona bien, y ya puedo seleccionar los registros, ya que la consulta me coje lo que he seleccionado en la parte de mi formulario que utilizo para filtrar, aunque tengo algún problemilla que de verdad no entiendo, por supuesto no me gustaria abusar de tu ayuda.

Veras al entrar por primera vez en la página me recarga el div con todos los coches sin ningún tipo de filtración y eso es correcto pero el problema es los datos de la edad y el precio del vehiculo me sale con caracteres raros me sustituye las ñ y el simbolo del euro €, el nombre de la ciudad sale correcto aunque lleve acentos.

Código :

15 años / 800 €uros 
Castellón 
Pero aun hay mas, cuando utilizo el filtro la primera vez me invierte el problema el nombre de la ciudad cuando lleva acentos me sale mal y el resto de datos edad y precio correcto.

Código :

10 años / 1175 €uros 
C�res //estos datos corresponden a la ciudad de Cáceres.
No lo entiendo, el cotejamiento de mi base de datos es:utf8_spanish_ci.
En mi página Coches.php la cabecera es:

Código :

 <meta content="text/html; charset=iso-8859-1" http-equiv=content-Type
mi Pagina1.php no lleva cabecera, antes cuando estaba todo en la misma página funcionaba bien,
Pero aun hay mas, si filtro por una ciudad como ( Castellón, Cáceres etc... ) que llevan acento no me encuentra nada, así que he hecho un echo a la consulta y la veo correcta:

Código :

SELECT SQL_CALC_FOUND_ROWS * FROM coches WHERE Activacion = '1'AND coches.Ciudad = 'Cáceres' AND (coches.Aireacond = '1' or coches.Aireacond = '0')LIMIT 0, 12
si hago lo mismo con otra ciudad que no lleva acento me funciona perfectamente.
no veo el problema, ¿Lo ves tú?.
Un saludo y gracias por tu tiempo y esfuerzo.

Por Unexes

8 de clabLevel



 

msie8
Citar            
MensajeEscrito el 03 Dic 2012 07:53 pm
DriverOp no hagas caso del post que lleva esta fecha y esta hora: 03 Dic 2012 08:23 pm
Como decia al principio lo mande por que el anterior que te habia mandado no aparecia y habia estado haciendo unos pruebas. y era lo que me estaba pasando. Voy a probar lo que me aconsejas y te comento.

Un saludo.

Por Unexes

8 de clabLevel



 

msie8
Citar            
MensajeEscrito el 03 Dic 2012 10:03 pm
Buenas noches DriverOp, gracias por tu ayuda.
Antes de nada perdona por el post anterior pero es que no visualizaba tu contestación, no se que pasa pero mi Internet Explorer 8 no actualiza correctamente en el tiempo los post y eso que le borro la cache y las cookies ahora estoy utilizando el Chrome.

Bueno a lo nuestro ya había probado lo que me aconsejas que ponga, y con ello puesto ocurre lo que te voy a comentar.

Código :

<?php
if (!headers_sent()) {
   header("Content-Type: text/html; charset=UTF-8");
}
require_once('Connections/ConexionCoches.php');
$selciudad = $_GET['selciudad'];
$aireacond = isset($_GET['aireacond']);
?>
lo tengo puesto en la primera linea de mi Pagina1.php y me siguen apareciendo los siguientes problemas:

De entrada, sin filtrar nada, me saca todos los coches esto es correcto pero donde pone el nombre de la ciudad a la que corresponde ese coche si el nombre tiene acentos me los saca mal con caracteres raros, ejemplo:

Código :

22 años / 800 €uros
Castell�n
como ves la ciudad de Castellón la saca mal.
El select que se encuentra en Coches.php me lo llena tambien mal y tiene el mismo problema si tengo puesto esa parte de código ejemplo:

Código :

C�ceres, Almer�a

Por supuesto si selecciono en el select una ciudad que tenga acento en su nombre no me encuentra ningún registro ya que le he hecho un "echo" a la consulta seleccionando la ciudad de Cáceres y me devuelve esto:

Código :

SELECT SQL_CALC_FOUND_ROWS * FROM coches WHERE Activacion = '1'AND coches.Ciudad = 'C�ceres' AND (coches.Aireacond = '1' or coches.Aireacond = '0')LIMIT 0, 30
Como ves me devuelte en la consulta la ciudad con el caracter que corresponde al acento con un caracter raro.
He revisado mi base de datos Mysql, y lo veo todo correcto con phpMyAdmin he comprobado el Cotejamiento de la conexión al servidor y es: utf8_spanish_ci, todas mis tablas están tambien con el mismo cotejamiento.
En mi página Coches.php en la cabecera tengo esto:

Código :

<meta http-equiv="content-type" content="text/html;charset=iso-8859-1"> he probado poniendo
<meta http-equiv="content-type" content="text/html;charset=UTF-8">
y no cambia nada

Todas las pruebas las realizo en mi servidor local.
¿Por que ocurre eso?.
Un saludo y gracias por tu tiempo.

Por Unexes

8 de clabLevel



 

chrome
Citar            
MensajeEscrito el 04 Dic 2012 12:19 pm
Prueba lo siguiente:

Antes de ejecutar la primera consulta SQL, ejecuta esta otra:

Código MySQL :

SET NAMES 'utf-8'


El problema puede estar en que aunque la base de datos esté completamente en UTF-8, la transmisión entre MySQL y el servidor web no lo sea. La sentencia que indiqué configura exactamente eso, que la transmisión sea también en UTF-8.

En la página "Coches.php", al inicio, también ejecuta la función header() tal como te lo había dicho para "Pagina1.php".

En el HTML el tag meta también debe indicar UTF-8. De hecho los códigos fuentes que estés haciendo también deben estar guardados en UTF-8.

En definitiva ABSOLÚTAMENTE TODO debe ser UTF-8 :D

Por DriverOp

Claber

2510 de clabLevel



 

opera
Citar            
MensajeEscrito el 04 Dic 2012 02:56 pm
Un montón de gracias DriverOp por tu tiempo y por tu ayuda, funciona perfectamente, no ha hecho falta poner en Coches.php la función header().
Pero aun me queda varias cosas por hacer he probado a pasar todo mi código de $_GET a $_POST y en la página Pagina1.php me indica el siguiente notice:

Código :

Undefined index: selciudad in C:\wamp\www\Pruebascoches\Pagina1.php on line 7
y esta es la linea del notice:

Código :

$selciudad = $_POST['selciudad']; // esta linea es la del error.
$aireacond = isset($_POST['aireacond']);
He probado de varias formas por ejemplo de esta

Código :

$selciudad = isset($_POST['selciudad']);
y ya no me da el error pero no me filtra a sí que no funciona bien, he probado con un if y con empty pero no consigo hacerlo funcionar.
Un saludo y muchisimas gracias.

Por Unexes

8 de clabLevel



 

chrome
Citar            
MensajeEscrito el 04 Dic 2012 04:39 pm
No te funciona porque en la llamada Ajax estás pasando el formulario por GET, no por POST.
Lamentablemente no tengo tanta experiencia en la implementación de Ajax de JQuery como para ayudarte en ese punto (yo uso mi propia implementación...).

Por DriverOp

Claber

2510 de clabLevel



 

opera

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.