Problema nella validazione di un form con JQUERY ed AjAX

ducadimantova

Nuovo Utente
30 Ago 2012
31
0
6
Ciao a tutti.

Ho un problema nella validazione di un form con JQUERY.

Il mio script prevede un file html con all'interno un form ed uno script in jQUERY che effettua una chiamata AJAX ad un file PHP. Il risultato restituito dal file PHP viene poi stampato all'interno di un DIV posizionato sotto al form.
Ecco il mio file html:

HTML:
<!DOCTYPE html>
<html lang="en">
    <head>
        <title>Form AJAX</title>
        <meta charset="utf-8" />

        <script src="http://code.jquery.com/jquery-latest.js"></script>
        <script>
        $(function() {
            $("#submit").click(function() {
                $.post("engine_inserimento_utenti.php", {
                    nome:      $("#nome").val(),
                    cognome:   $("#cognome").val(),
                    email:     $("#email").val(),
                    password:  $("#password").val(),
                    password2: $("#password2").val()
                }, function(data) {
                    $("#risposta").html(data);
                });
            });
        });
        </script>
    </head>

    <body>
        <form class="form_admin" method="post">
            <p class="testo_admin">Inserisci il nuovo nome utente:</p>
            <input type="text" id="nome" class="input_admin" />

            <p class="testo_admin">Inserisci il cognome del nuovo utente:</p>
            <input type="text" id="cognome" class="input_admin" />

            <p class="testo_admin">Inserisci un indirizzo email:</p>
            <input type="text" id="email" class="input_admin" />

            <p class="testo_admin">Inserisci una password per il nuovo utente:</p>
            <input type="password" id="password" class="input_admin" />

            <p class="testo_admin">Ripeti la password:</p>
            <input type="password" id="password2" class="input_admin" />

            <input type="button" value="Inserisci" id="submit" class="bottone_admin" />
        </form>

        <div id="risposta"></div>
    </body>
</html>


Niente di più semplice.
Fin qui nessun inconveniente, tutto funziona.

Il problema è che a me serve che il form venga generato dinamicamente da una pagina PHP e pertanto stampato con il comando "echo" all'interno di un'apposita area di una pagina dinamica.

Ho posizionato lo script JQUERY di cui sopra all'inerno della HEAD di tale pagina dinamica. All'interno di questa pagina dinamica, cliccando su un pulsante, viene richiamato il form di cui sopra (a sua volta generato da una funzione ajax).

Inserisco i dati nel form. Premo invio ed il tutto smette di funzionare!!

Non riesco a capire!!


Qualcuno può darmi qualche suggerimento???

Grazie mille!
 
Ultima modifica di un moderatore:

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Ciao,
forse è un problema di apici
puoi postare la pagina php con la chiamata ajax e l'echo del form?
 

ducadimantova

Nuovo Utente
30 Ago 2012
31
0
6
Ecco il (quasi) tutto

Ciao Criric

quella che ho postato sotto è la pagina dinamica all'interno della quale viene visualizzato il form per l'inserimento di un nuovo utente (il form incriminato).

Si tratta di una pagina di amministrazione: se l'utente risulta loggato la pagina viene stampata altrimenti viene visualizzato un messaggio di errore. Lo script JQUERY di cui sopra è quello in grassetto.

All'interno del div con classe "banner_collegamenti" è contenuto il menu che, tramite chiamate AJAX con GET fa visualizzare un diverso form a seconda della scelta dell'utente: non l'ho postato per intero...

Il link che richiama il mio form è il primo in grassetto all'interno di detto menu.

Il div con classe "area modifica" è quello all'interno del quale viene visualizzato il form.
PHP:
<?php 
session_start();

echo "<!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>Untitled Document</title>
<link href='style.css' rel='stylesheet' type='text/css' />

[B]<script src='http://code.jquery.com/jquery-latest.js'></script>
<script>
        $(function() {
            $('#submit').click(function() {
                $.post('engines/engine_inserimento_utenti.php', {
                    nome:      $('#nome').val(),
                    cognome:   $('#cognome').val(),
                    email:     $('#email').val(),
                    password:  $('#password').val(),
                    password2: $('#password2').val()
                }, function(data) {
                    $('#risposta').html(data);
                });
            });
        });
        </script>[/B]


<script type='text/javascript' src='modarea.js'></script>
<script type=text/javascript src=jquery-1.5.2.min.js ></script>
<script type='text/javascript' >

$(document).ready

(

	function()
	{
	
		$('#tendina_modifica_foto').hide();
		    
		    $('#apri_tendina_modifica_foto').click
		    
			    (
			    	function()
			    	
				    	{
		                
	                    $('#tendina_modifica_foto').slideToggle('slow');
				    	
		                });
	});
	
</script>


<script type='text/javascript' src='ckeditor/ckeditor.js'></script>

</head>
<body>";

if(!isset($_SESSION["email_utente"])){
	
	echo "<div class='contenitore_errore'><h1><b>Errore: utente non autorizzato!</b></h1> <br />Per entrare nell'area amministrazione devi effettuare l'accesso tramite il form che trovi nella Home Page<br /><br /><br /><b>-> <a href='index.php'>Vai alla Home</a> <-</b></div>";
	
}else{



echo "



<div class='contenitore_principale'>
<div class='banner_link'><p class='intestazione'>Benvenuto nell'area amministrazione. Sei loggato come:";




echo "<b>".$_SESSION["email_utente"]."</b>";

echo "

--- <a href='index.php'><b>Torna alla Homepage >></b></a></p></div>

<div class='banner'></div>
  [B]<div id='banner_collegamenti'>[/B]
   <ul>
   <li><a href='visualizzatore.php?sezione=principale'>Principale</a>
		   <ul>
		      <li><a href='visualizzatore.php?sezione=principale'>Utenti</a>
		           <ul>
	               [B]<li><a href='javascript:modifica(\"inserimento_utenti\", \"\", \"\")'>Inserisci</a></li>[/B]
	               <li><a href='visualizzatore.php?sezione=utenti&modifica=ok'>Modifica</a></li>
			   	   </ul>
	          </li>
		   </ul>
	   </li>
   <li><a href='visualizzatore.php?sezione=principale'>Corsi</a>
      <ul>
         <li><a href='visualizzatore.php?sezione=principale'>Violino</a>
	         	   <ul>
	               <li><a href='javascript:modifica(\"corsi\", \"violino\", \"\")'>Inserisci</a></li>
	   			   <li><a href='javascript:modifica(\"corsi\", \"violino\", \"ok\")'>Modifica</a></li>
	               </ul>
         
         </li>
         <li><a href='visualizzatore.php?sezione=principale'>Tromba</a>
         <ul>
	               <li><a href='javascript:modifica(\"corsi\", \"tromba\", \"\")'>Inserisci</a></li>
	   			   <li><a href='javascript:modifica(\"corsi\", \"tromba\", \"ok\")'>Modifica</a></li>
	               </ul>         
         </li>
         
        [B]ecc....[/B]

  </div>

<div class='area_amministrazione' id='area_modifica'>";

echo $_SESSION["messaggio_conferma"];


unset($_SESSION["messaggio_conferma"]);

if(isset($_SESSION["area_modifica"])){
	
	
	echo $_SESSION["area_modifica"];
	
	
	unset($_SESSION["area_modifica"]);
	
};

echo"

<!-- chiusura dell'area amministrazione -->
</div>


<!-- Chiusura del contenitore principale -->
</div>";

//Chiusura della seconda condizione: quella secondo la quale l'utente ha effettuato l'accesso correttamente
}

echo "
</body>
</html>";

?>

Quella riportata sotto è la porzione di codice che stampa il form a seguito della chiamata AJAX al click sul link di cui sopra, il form viene visualizzato correttamente, è il passaggio dei dati che non funziona:
PHP:
if($_GET["sezione"]=="inserimento_utenti"){
     	
    	$sezione="Inserisci i dati del nuovo utente utilizzando i campi del form sottostante:";
    	
    	echo "
    			
    	<form class='form_admin' method='post'>
    	    <p class='testo_admin'>".$sezione."</p>
            <p class='testo_admin'>Inserisci il nuovo nome utente:</p>
            <input type='text' id='nome' class='input_admin' />
            <p class='testo_admin'>Inserisci il cognome del nuovo utente:</p>
            <input type='text' id='cognome' class='input_admin' />
            <p class='testo_admin'>Inserisci un indirizzo email:</p>
            <input type='text' id='email' class='input_admin' />
            <p class='testo_admin'>Inserisci una password per il nuovo utente:</p>
            <input type='password' id='password' class='input_admin' />
            <p class='testo_admin'>Ripeti la password:</p>
            <input type='password' id='password2' class='input_admin' />
            <input type='button' value='Inserisci' id='submit' class='bottone_admin' />
       	    </form>

        <div id='risposta'></div>
    			
    			";
    	exit;
Infine il file PHP che per adesso mi serve solo a verificare il funzionamento del form e pertanto si limita a stampare quanto ricevuto da parte del form:
PHP:
<?php 

	echo $_POST["nome"].$_POST["cognome"].$_POST["email"].$_POST["password"].$_POST["password2"];

?>
Chiedo perdono se il tutto è po' pasticciato: ma è tipico degli apprendisti stregoni :D
 
Ultima modifica di un moderatore:

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Ok, si è un po incasinato, ma ho visto di peggio :)

partiamo dal primo pezzo di codice ..

hai la funzione all'evento onclick

Codice:
$('#submit').click(function()

ma non vedo nessun pulsante con id #submit nella prima parte

quand'è che richiami il form?

PS racchiudi il codice tra i tag che trovi sulla seconda riga della barra di formattazione ( CODE,HTML o PHP )
 

ducadimantova

Nuovo Utente
30 Ago 2012
31
0
6
Un po' d'ordine...

Ciao

richiamo il form cliccando sul link che vedi sotto

quello all'interno del div con id='banner_collegamenti' (prima parte di codice):


HTML:
<li><a href='javascript:modifica(\"inserimento_utenti\", \"\", \"\")'>Inserisci</a></li>


Il pulsante con #submit si trova in fondo alla seconda parte di codice, parte che viene stampata quando clicchi sul link che ho messo sopra.

Il form viene stampato all'interno del <div> che vedi in fondo alla prima parte:


HTML:
<div class='area_amministrazione' id='area_modifica'>


Spero che ora sia un po' meno confuso :)

Grazie mille!
 
Discussioni simili
Autore Titolo Forum Risposte Data
loois Ho un problema nella creazione di un sistema di commenti in PHP PHP 11
S [Javascript] [HTML] problema nella stampa degli elementi della pagina Javascript 3
P doppio problema nella memorizzazione dati PHP 11
M Ipn paypal problema nella risposta PHP 1
C Problema apertura slide nella hompage HTML e CSS 0
J Problema con link nella barra di navigazione HTML e CSS 1
S Problema con 2 script nella stessa pagina Javascript 1
P problema nella stampa di table HTML e CSS 1
S Problema nella pagina di registrazione e login PHP 2
A problema nella visualizzazione file caricato tramite ftp WordPress 0
L problema nella implementare una funzione con ritorno PHP 2
Emix Problema nel concatenare jquery ed ajax nella stessa pagina Javascript 15
W Problema nella pubblicazione programmata di un articolo WordPress 1
D Problema nella chiamata ad una funzione javascript da href Ajax 2
G Problema nella pagine dei risultati ricerca Wordpress WordPress 2
G Problema nella creazione di un'area protetta PHP 10
G problema caricamento 2 js nella stessa pagina Javascript 0
max_400 Problema apostrofo nella ricezione della variabile per poi scriverla dentro un file PHP 6
giancadeejay Intro flash,problema nella visualizzazione su sito Flash 2
F problema sintassy nella mia query MySQL 6
A Problema nella creazione di un area protetta!!!! Classic ASP 3
F problema nella connessione con mysql presente in Aruba PHP 3
Dragon Problema di caricamento swf e img nella stessa pagina Flash 8
L Problema nella visualizzazione HTML e CSS 0
K problema nella formattazione del valore di una variabile PHP 0
I Sto progettando nuovi siti utilizzando bootstrap e devo dire funziona bene, l'unico problema e la maschera -moz- HTML e CSS 0
K Problema form update PHP 2
O problema con dvr dahua xvr5116 IP Cam e Videosorveglianza 0
S Problema nel ciclare un json Javascript 0
G Problema con Xampp Web Server 1
andrea barletta Problema con miniature comandi Photoshop 0
I problema con alice Posta Elettronica 0
K Problema Inner join PHP 1
F firefox problema http Linux e Software 0
N Problema con position absolute e overflow HTML e CSS 4
E Problema jquery Success jQuery 2
L Problema con inner join PHP 11
K [php] Problema con inner join PHP 4
E problema selezione sfumata Photoshop 2
K [PHP] Problema con variabili concatenate. PHP 1
A Problema filtro fluidifica Photoshop Photoshop 1
H Problema Bordi Scontorno Photoshop 1
O problema con query PHP 4
R Problema installazione Realtek WiFi USB rtl8821 Reti LAN e Wireless 0
I problema con 2 account Posta Elettronica 1
L problema collegamento file css con html HTML e CSS 1
Y Problema percorso file in rete PHP 1
N Problema SEO "L'URL non si trova su Google" SEO e Posizionamento 4
E Problema accesso a file con app sviluppata con MIT APP INVENTOR 2 Sviluppo app per Android 0
P Problema acquisizione clienti Webdesign e Grafica 1

Discussioni simili