Funzioni wordpress in javascript

Discussioni e problematiche su linguaggio Javascript e framework come jQuery e simili.

Moderatori: maurizio, markdesign

Regole del forum
Per scrivere del codice all'interno di ogni post, utilizzare il tag: [syntax=il_linguaggio]codice[/syntax] sostituendo "il_linguaggio" con il linguaggio del codice che dovete inserire, ad esempio: html, css, javascript, php, asp, ecc...

Funzioni wordpress in javascript

Messaggioda enova » martedì 7 settembre 2010, 15:08

Ciao a tutti, sto creando un template in wordpress e ho creato un contact form con validazione in javascript... nella validazione il file javascript deve "caricare" un file .php, questa è una parte del codice :
Sintassi: javascript [ Scarica ] [ Nascondi ]
  1. else {
  2.                 $('#load_img').fadeIn();
  3.                 $.ajax({
  4.                         type: 'post',
  5.                         url: 'inviaemail.php',
  6.                         data: 'name=' + name.val() + '&email=' + email.val() + '&site=' + sito.val() + '&message=' + message.val(),
  7.                         success: function(results) {
  8.                                 $('#load_img').fadeOut(function() {
  9.  


come vedete url: 'inviaemail.php' è dove viene caricato il file .php ma purtroppo in questo modo il form non funziona perchè cerca il file nella root di wordpress e non nella root del tema... la funzione di wordpress per localizzare il tema è questa :

Sintassi: php [ Scarica ] [ Nascondi ]
  1. <?php bloginfo('template_directory'); ?>


come posso fare per far caricare questo file ?
enova

Avatar utente
 
Messaggi: 30
Iscritto il: mercoledì 2 giugno 2010, 15:10

Re: Funzioni wordpress in javascript

Messaggioda antoscarface » martedì 7 settembre 2010, 17:01

enova ha scritto:Ciao a tutti, sto creando un template in wordpress e ho creato un contact form con validazione in javascript... nella validazione il file javascript deve "caricare" un file .php, questa è una parte del codice :
Sintassi: javascript [ Scarica ] [ Nascondi ]
  1. else {
  2.                 $('#load_img').fadeIn();
  3.                 $.ajax({
  4.                         type: 'post',
  5.                         url: 'inviaemail.php',
  6.                         data: 'name=' + name.val() + '&email=' + email.val() + '&site=' + sito.val() + '&message=' + message.val(),
  7.                         success: function(results) {
  8.                                 $('#load_img').fadeOut(function() {
  9.  


come vedete url: 'inviaemail.php' è dove viene caricato il file .php ma purtroppo in questo modo il form non funziona perchè cerca il file nella root di wordpress e non nella root del tema... la funzione di wordpress per localizzare il tema è questa :

Sintassi: php [ Scarica ] [ Nascondi ]
  1. <?php bloginfo('template_directory'); ?>


come posso fare per far caricare questo file ?


Avendo lo script all'interno del template (e non in un file js a parte), puoi semplicemente sostituire il nome del file nello script ajax, con la funzione che genera il percorso del tema.

Mi spiego in termini pratici:
Sintassi: javascript [ Scarica ] [ Nascondi ]
  1. else {
  2.                 $('#load_img').fadeIn();
  3.                 $.ajax({
  4.                         type: 'post',
  5.                         url: '<?php bloginfo('template_directory'); ?>inviaemail.php',
  6.                         data: 'name=' + name.val() + '&email=' + email.val() + '&site=' + sito.val() + '&message=' + message.val(),
  7.                         success: function(results) {
  8.                                 $('#load_img').fadeOut(function() {
  9.  


nell'attributo "url:" ho aggiunto semplicemente il tag php con la funzione che genera il percorso del tema... credo che così dovrebbe funzionare :)

Facci sapere.
antoscarface

Amministratore

Avatar utente
 
Messaggi: 723
Iscritto il: giovedì 21 gennaio 2010, 1:08
Località: Siracusa

Re: Funzioni wordpress in javascript

Messaggioda enova » martedì 7 settembre 2010, 19:08

grazie per la risposta, a questo ci avevo pensato il problema è che lo script utilizzato dal contact form è composto da 110 righe di codice, e includerlo dentro al template non è che mi "piaccia" molto.. ecco perchè cercavo aiuto...
enova

Avatar utente
 
Messaggi: 30
Iscritto il: mercoledì 2 giugno 2010, 15:10

Re: Funzioni wordpress in javascript

Messaggioda antoscarface » martedì 7 settembre 2010, 22:14

potresti inserire tutto il codice in una funzione, facendo passare, come parametro, il percorso del file php e nella pagina del template, richiami la funzione passando il percorso generato dalla funzione di WP.

Cioè:

file.js
Sintassi: javascript [ Scarica ] [ Nascondi ]
  1. function funzione(file_php)
  2. {
  3. .......
  4. $.ajax({
  5.                         type: 'post',
  6.                         url: file_php,
  7. .......
  8. }
  9.  


pagina.php
Sintassi: html [ Scarica ] [ Nascondi ]
  1. ......
  2. <script type="text/javascript">
  3. funzione(<?php bloginfo('template_directory') ?>)
  4. </script>
  5. ......
  6.  


Non ho altre soluzioni, sicuramente ce ne saranno altre, ma credo che questa possa funzionare.
antoscarface

Amministratore

Avatar utente
 
Messaggi: 723
Iscritto il: giovedì 21 gennaio 2010, 1:08
Località: Siracusa

Re: Funzioni wordpress in javascript

Messaggioda enova » mercoledì 8 settembre 2010, 10:07

su un altro forum un utente mi ha risposto dicendomi di modificare il codice in questo modo :
Sintassi: javascript [ Scarica ] [ Nascondi ]
  1. var $post_url = $("form#contatti").attr('action');
  2.  
  3.     $('#load_img').fadeIn();
  4.     $.ajax({
  5.             type: 'post',
  6.             url: $post_url,
  7.  


O_o l'ho modifcato ed infatti funziona, cioè almeno sembra che funzioni, il form dice che l'email è stata inviata solo che il template è in locale quindi non posso testare se effettivamente abbia mandato la mail...

qualcuno sa spiegarmi cosa significano le modifiche apportate ? (ci capisco poco di javascript)
enova

Avatar utente
 
Messaggi: 30
Iscritto il: mercoledì 2 giugno 2010, 15:10

Re: Funzioni wordpress in javascript

Messaggioda antoscarface » mercoledì 8 settembre 2010, 12:29

Ah ecco, non avevo pensato a quest'altra soluzione.

In pratica, nell'html tu puoi scrivere: (ti metto solo quello che serve, il resto è scontato che ci sia)
Sintassi: html [ Scarica ] [ Nascondi ]
  1. <form action="file.php" id="contatti" ...>
  2. .......
  3. </form>
  4.  


nel file.js, innanzitutto ha inizializzato la variabile che prende direttamente il valore dell'action del form con id #contatti, cioè questa riga:
Sintassi: javascript [ Scarica ] [ Nascondi ]
  1. var $post_url = $("form#contatti").attr('action');
  2.  

che "letteralmente" significa: inizializza la variabile "$post_url" e assegnali il valore dell'attributo 'action' dell'elemento "form#contatti" (cioè l'elemento form con id "contatti")

Successivamente, assegna al valore url, il valore della variabile, cioè qui:
Sintassi: javascript [ Scarica ] [ Nascondi ]
  1. url: $post_url,
  2.  



Tutto qui, spero sono riuscito a farti capire il meccanismo :)
antoscarface

Amministratore

Avatar utente
 
Messaggi: 723
Iscritto il: giovedì 21 gennaio 2010, 1:08
Località: Siracusa

Re: Funzioni wordpress in javascript

Messaggioda enova » mercoledì 8 settembre 2010, 15:17

ah ok grazie mille ora mi è più chiaro :)
enova

Avatar utente
 
Messaggi: 30
Iscritto il: mercoledì 2 giugno 2010, 15:10


Torna a Javascript