GUIDA JQUERY (TUTORIAL) 14. INVIARE E RICEVERE DATI SENZA RICARICARE LA PAGINA(JSON)
./image/upload/13-06-2017-16-49-43.jpg

foto-1

I siti più dinamici ad oggi effettuano delle comunicazioni con il server in continuazione senza costringere il visitatore a continui refresh di pagina.

Il codice che vado a mostrare è molto semplice,
- prende i dati inseriti dal visitatore
- li analizza con Jquery senza ricaricare la pagina
- se i dati sono tutti compilati li passa ad un'altra pagina
- preleva quello che viene stampato nell'altra pagina e lo scrive in una div

Tutto questo senza neanche un refresh.

Nel Body della pagina index.html

Questo è semplicemente un modulo.

<FORM>
First name: <input type="text" id="nome" name="fname">

Last name: <input type="text" id="cognome" name="lname">

<input type=button id=bottone_sub value="PROSEGUI">
</FORM>

<div class="result">BOX DI RISPOSTA</div>

Nei tag script della pagina index.html

Questo script controlla che i campi siano compilati e nel caso li passa alla pagina risposta.html e stampa il risultato presente in risposta.html direttamente nella DIV result.

$ ("#bottone_sub").click(function(){
var errore_trovato=0;
if($("#nome").val()!=""){}else {alert("Manca Nome"); errore_trovato=1;}
if($("#cognome").val()!=""){}else {alert("Manca Cognome"); errore_trovato=1;}
if(errore_trovato==0)
{
$.get( "risposta.html", function( data ) {
$( ".result" ).html( data );
alert( "Caricamento OK." );
});
}
});

Nel Body della pagina risposta.html

Modulo Inviato!!

Ovvio che se questa fosse una pagina PHP o ASP potreste effettuare delle operazioni sui dati passati ed interrogare un DataBase prima di stampare una risposta.


Buon Web a tutti

nomeprezzofoto
01. INTRODUZIONE
02. INTEGRAZIONE
03. STAMPA A VIDEO
04. ALERT, PROMPT E DIALOG
05. OPERAZIONI MATEMATICHE
06. INTERAZIONE CON FORM
07. INTERAZIONE CON LE PAGINE
08. INTERAZIONE CON I DIV
09. FUNZIONI
10. CONDIZIONI
11. GESTIONE FORM GET E POST
12. GESTIONE ARRAY

Developer - Problem Solver - Business Intelligence

Gestione Hyper-V

Panthera ERP Biella

Programmatore Html - Css Biella

Programmatore Javascript - Jquery Biella

Programmatore PHP Biella

Programmatore SQL Biella

Programmatore Web app Biella

Programmatore Web Biella

Realizzazione Dashboard Personalizzate Biella

Soluzioni B.I. con Qlik View e Qlik Sense Biella

Sviluppo Reportistica Crystal Report Biella

Webmaster Biella

Programmatore web - Webmaster Elio Curtacci
Made with made in italy in Italy
Questo sito web utilizza i COOKIE per dare all'utente un'esperienza di visita migliore.

LOG-IN