Problems with ajax

  • Hi all, i’m developing a simple plugins that use ajax to dynamically retrieve data from an array. Here’s my piece of code:

    <select name='openitaly4wp_regione' onChange=\"ajaxViewProvince(this[this.selectedIndex].value,'divProvincia');\">
        <option value='$openitaly4wp_regione'>$openitaly4wp_regione</option>
        <option value='Abruzzo'>Abruzzo</option>
        <option value='Basilicata'>Basilicata</option>
        <option value='Calabria'>Calabria</option>
        <option value='Campania'>Campania</option>
        <option value='Emilia-Romagna'>Emilia-Romagna</option>
        <option value='Friuli-Venezia Giulia'>Friuli-Venezia Giulia</option>
        <option value='Lazio'>Lazio</option>
        <option value='Liguria'>Liguria</option>
        <option value='Lombardia'>Lombardia</option>
        <option value='Marche'>Marche</option>
        <option value='Molise'>Molise</option>
        <option value='Piemonte'>Piemonte</option>
        <option value='Puglia'>Puglia</option>
        <option value='Sardegna'>Sardegna</option>
        <option value='Sicilia'>Sicilia</option>
        <option value='Toscana'>Toscana</option>
        <option value='Trentino-Alto Adige'>Trentino-Alto Adige</option>
        <option value='Umbria'>Umbria</option>
        <option value='Valle Aosta'>Valle d'Aosta</option>
        <option value='Veneto'>Veneto</option>
    </select></p>
    <p>Provincia:<div id='divProvincia'><select name='openitaly4wp_provincia'>
        <option value='$openitaly4wp_provincia'>$openitaly4wp_provincia</option>
    </select></div></p>
    <p>Comune<div id='divComune'><select name='openitaly4wp_comune'>
        <option value='$openitaly4wp_comune'>$openitaly4wp_comune</option>
    </select></div></p>
    <div id='loading' style='display: none;'>
        <img src='".openitaly4wp_path("img/spinner.gif")."' style='width:12px; height:12px; vertical-align: middle;'>&nbsp;Please wait, loading data...
    </div>";

    and this is javascript functions:

    <script type='text/javascript'>
    //<![CDATA[
    function ajaxViewProvince(regione,container) {
        jQuery.ajax({
            type: 'post',
            url: '".openitaly4wp_path("ajaxcb.php")."',
            data: { action: 'getprov', regione: regione},
            beforeSend: function() {
                jQuery('#loading').show('slow');
            },
            complete: function() {
                jQuery('#loading').hide('fast');
            },
            success: function(html) {
                jQuery(container).html(html);
            }
        });
        return true;
    }

    function ajaxViewComuni(regione,provincia,container) {
        jQuery.ajax({
            type: 'post',
            url: '".openitaly4wp_path("ajaxcb.php")."',
            data: { action: 'getcomuni', regione: regione, provincia: provincia},
            beforeSend: function() {
                jQuery('#loading').show('slow');
            },
            complete: function() {
                jQuery('#loading').hide('fast');
            },
            success: function(html) {
                jQuery(container).html(html);
            }
        });
        return true;

    }
    //]]>
    </script>

    ajaxcb.php simply return HTML code to be renderered inside “container” div. Using HttpFox to see what’s happen, seems that ajax call was fine but i can’t see any results. I’ve tried also with fixed *echo” without success so i think i’m still doing something wrong.

    Any help very appreciated !

    Michele “O-Zone”

Viewing 2 replies - 1 through 2 (of 2 total)

  • You’re passing a div ID to your AJAX function… don’t forget to access an ID you need to use the # character, such as jQuery('#content').html('foo');

    So, try this:

    <select name='openitaly4wp_regione' onChange=\"ajaxViewProvince(this[this.selectedIndex].value,'#divProvincia');\">

    or this:

    success: function(html) {
                jQuery('#'+container).html(html);
            }

    Also I’ve found Firebug (on Firefox) with the Net XHR panel to be invaluable in debugging AJAX.

    Thread Starter Michele Pinassi

    (@o-zone)

    YES YES YES !!! It works perfectly…thanks a lot !!!! If you wanna try, you can download full plugin code from https://www.openitaly.net/wp

    Michele “O-Zone”

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Problems with ajax’ is closed to new replies.