• User

    Problema controllo form con ajax

    Ciao a tutti .. è da poco che mi sono messo nel mondo wordpress/plugin!!

    Ora come ora ho un po di confusione .. ho letto tutto il materiale di supporto di wordpress riguardante AJAX in plugin, ma purtroppo il problema è rimasto.

    Qual'è il problema ?
    Nulla, la pagina form.php non comunica i dati del form e quindi non stampa gli eventuali errori presenti in esso (ad esempio mancanza compilazione campo).

    Ecco il mio codice: 🙂

    form.php

    <!--carico jquery-->
    <script type='text/javascript' src='jquery.js'></script>

    <!--url script ajax-->
    <script type='text/javascript'>
    <?php echo "ajaxurl = '".admin_url('admin-ajax.php')."';" ?>
    </script>

    <script type='text/javascript'>

    jQuery('#invia_richiesta').click(function(e) {
    my_event_click(this);
    });

    function my_event_click(clicked){      
     
     jQuery.ajax({        
       type: "POST",        
       url : ajaxurl,        
       data: { 
       action:'form',        
       }, 
        
       //in caso di successo        
       success:function(data) {          
       jQuery("#risultato").append(data);        
       },         
    
       //in caso di errore       
       error: function(error) {         
       jQuery("#risultato").append('qualcosa non va bene');        
       }       
    
     });    
    

    }

    </script>

    <?php
    add_action('wp_ajax_form','my_ajax');add_action('wp_ajax_nopriv_form','my_ajax');

    function ip_output_contact_form(){
    ?>

    <div class="ip_container">
    <div id="risultato"></div>
    
      <form id="contatto_assistenza" name="contatto_assistenza" >
    
      <p>Nome:</p>    
      <input type="text" name="nome" id="nome" />    
    
      <p>Cognome:</p>    
      <input type="text"  name="cognome" id="cognome" />    
    
      <p>La tua email:</p>    
      <input type="text" name="tua_email" id="tua_email" />    
    
      <p>Telefono:</p>    
      <input type="text" name="tuo_telefono" id="tuo_telefono" />    
    
      </br></br>    
    
      <button id="invia_richiesta" name="invia_richiesta">Invia richiesta</button>    
      </form>
    
    </div>
    

    <?php
    }

    add_shortcode('form', 'ip_output_contact_form');

    function my_ajax() {
    $nome = $_POST['nome'];

    if($nome == ""){
       echo "Campo nome obbligatorio";
    

    }

    die();

    }
    ?>

    Spero davvero tanto che qualcuno mi dica dov'è l'errore o (per me) gli errori.

    Ringrazio in anticipo!!


  • Moderatore

    Ma, occhio e croce, sembra un problema di recupero dati.
    Hai provato a recuperarti i campi del form uno ad uno e a passarli in ajax?


  • User

    Ciao Ultima,
    Innanzitutto grazie per l'aiuto che mi stai fornendo..

    Intendi in questo modo:

    function my_event_click(clicked){

    var (nome) = $('#nome').val();

    jQuery.ajax({
    type: "POST",
    url : ajaxurl,
    data: "nome=" + nome,


  • Moderatore

    Certamente.
    solo che in data utilizza questa sintassi che è piu corretta:
    data: { nome:nome }
    Per piu campi:
    data: { nome1:nome1, nome2:nome2 }


  • User

    Ciao Ultima 🙂

    Ti volevo dire che ho riguardato per bene tutto il form + codice script.. ho modificato alcune cose..

    Ecco le modifiche effettuate:

    form.php

    //al click sul bottone del form
    $("#invia_richiesta").click(function(){
    var nome = $('#nome').val();
    var cognome = $('#cognome').val();
    var tua_email = $('#tua_email').val();
    var tuo_telefono = $('#tuo_telefono').val();

    jQuery.ajax({
    type: "POST",
    url : "127.0.0.1/wordpress/wp-content/plugins/contact-form/controllo.php",
    data: {nome:nome, cognome:cognome, tua_email:tua_email, tuo_telefono:tuo_telefono},

    ed ho creato questo file di controllo..(che poi provvederò a trovare un modo per inserirlo all'interno di una classe OOP)

    controllo.php
    $nome = $_POST['nome'];
    $cognome = $_POST['cognome'];
    $tua_email = $_POST['tua_email'];
    $tuo_telefono = $_POST['tuo_telefono'];

    if(($nome == "") or ($cognome == "") or ($tua_email == "") or ($tuo_telefono == "")){
    echo "I seguenti campi sono obbligatori:</br>
    <b>1: Nome</b><br/>
    <b>2: Cognome</b><br/>
    <b>3: Email</b><br/>";
    }else{
    echo $nome . "<br/>" . $cognome . "<br/>" . $tua_email . "<br/>" . $tuo_telefono;
    }

    Ora l'unico problema che mi si è posto è questo .. il tutto funziona correttamente .. l'unico "inghippo" è che il risultato dell'errore o lo stampo degli input rimane a schermo solo il tempo di ricarica pagina.. poi scompare.

    Il problema potrebbe essere nell'url che ho impostato ?

    Grazie ancora !!!


  • Moderatore

    Se ti ricarica la pagina è perche non inibisci il submit del form e pertanto il form procede cmq il suo normale corso. Prova ad utilizzare un plugin jquery chiamato jquery.form


  • User

    Ancora ciao Ultima 🙂

    Ho avuto un pochettino da fare .. comunque posso dire che il mio problema è stato RISOLTO !
    adesso valuto cm inibire il form ..
    ma Grazie davvero per tutti i consigli e le dritte !!!