webmaster programmatore php mysql java javascript

Web Developer


GUIDA JQUERY (TUTORIAL) 14. INVIARE E RICEVERE DATI SENZA RICARICARE LA PAGINA(JSON)
./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

Articoli Correlati
./upload/13-09-2017-08-39-51.jpg15. GESTIONE MATRICE
./upload/18-07-2016-09-57-24.jpg13. GESTIONE ARRAY MULTIDIMENSIONALI JAVASCRIPT
./upload/06-04-2016-14-24-12.jpg12. GESTIONE ARRAY
./upload/05-04-2016-15-25-56.jpg11. GESTIONE FORM GET E POST
./upload/05-04-2016-15-27-30.jpg10. CONDIZIONI
./upload/05-04-2016-15-24-30.jpg9. FUNZIONI
./upload/05-04-2016-15-18-16.jpg8. INTERAZIONE CON I DIV
./upload/05-04-2016-15-17-23.jpg7. INTERAZIONE CON LE PAGINE
./upload/05-04-2016-15-16-42.jpg6. INTERAZIONE CON FORM
./upload/05-04-2016-15-15-28.jpg5. OPERAZIONI MATEMATICHE
./upload/05-04-2016-15-14-30.jpg4. ALERT, PROMPT E DIALOG
./upload/05-04-2016-15-13-55.jpg3. STAMPA A VIDEO
./upload/05-04-2016-15-13-08.jpg2. INTEGRAZIONE
./upload/05-04-2016-15-12-24.jpg1. INTRODUZIONE

Developer - Problem Solver - Business Intelligence

PHP

Javascript - JQuery

Css

SQL

Panthera ERP

Crystal Report

Qlik View - Qlik Sense

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