Question

How can refresh an html element when its value is changing. I mean assume that i have this tag:

<div id="response" style="display:none;"><div>

and i have this script:

<script type="text/javascript">
    $('#delete_link').click(function(e) {
        e.preventDefault();
        $('#result').html('').load('{% url messages_delete message.id %})
        alert($('#result').html());
        $('#'+$('#result').html()+'_list').trigger('click');
    });
</script>

when user clicks on delete_link, the server sends a value to response div, so response div which was empty before, now has a value, and i will use it’s value to know which tab i should trigger. when i use alert, it understands that the value of this tag is changed, and the trigger works. but without alert, it seems it doesn’t understand the value is changed and trigger doesn’t work. Is there a way to tell the program that the value is changed? i don’t want to use alert. thanks very much for your help

Answer 1

.Load() is asynchronous, you need to set your content html in the load callback function.

 $('#delete_link').click(function(e) {
        e.preventDefault();
        $('#result').html('').load('{% url messages_delete message.id %}',function(){
           $('#'+$('#result').html()+'_list').trigger('click');
        });
    });