Question

I am using following script to get Gravatar on my dynamic page,

<input type="text" id="email" value="{$clientemail}" style="display:none;"/> 

  $(document).ready(function(){           
                $('.p').append($.gravatar($('#email').val(), {
                method: 'append',
                size: '100',
                image: '/images/1.png',
                rating: 'r'
            }));
        }); 


<div class="p" style="width:100px;height:100px">

I have to load value of {$clientemail} using following code from another page.

$('#email').load('clientarea.php? #clientemail');

My problem is .load is taking few seconds to load & So .append is sending null value, Resulting in default Gravatar pic.

How do I overcome this isuue ??

Thanks

Answer 1

You need to stick the append code in the load callback, like this:

$('#email').load('clientarea.php? #clientemail' function() {
  $('.p').append($.gravatar($(this).val(), {
            method: 'append',
            size: '100',
            image: '/images/1.png',
            rating: 'r'
        }));
});

Though, .load() into an input element like this isn’t recommended, it would be better to use a $.get() request and grab that value out, like this:

$.get('clientarea.php?', function(data) {
  var val = $('#clientemail', data).val();
  //if needed: $('#email').val(val);
  $('.p').append($.gravatar(val, {
            method: 'append',
            size: '100',
            image: '/images/1.png',
            rating: 'r'
        }));
});