CODEWITHSUNDEEP
phpjquery
user1010775
user1010775

Reputation: 371

Trigger jQuery function after submit

I need to trigger a function after the submit function has been executed. In the first PHP file I choose an image, after this it calls the second file which echos the image and some input elements after the upload. At this point I also want a colopicker. The code I'm using I found here. The code in the first file is:

<script type="text/javascript" >
    $(document).ready(function() {      
        $('#photoimg').live('change', function() { 
            $("#preview").html('');
            $("#preview").html('<img src="loader.gif" alt="Uploading...."/>');
            $("#imageform").ajaxForm({
                target: '#preview'
            }).submit();
            $('#color1').colorPicker();
        });
    }); 
</script>

The file which is called echos then the image, which is showed in the first file in the div element "preview".

echo "<img src='uploads/".$actual_image_name."'  class='preview'><br  />";
echo "<input id='color1' type='text' name='color1' value='#333399' />;

At the moment it calles the colorpicker function before the elements are echoed.how can i let it run after it is all echoed? Thanks for any help!

Upvotes: 1

Views: 668

Answers (1)

Rory McCrossan
Rory McCrossan

Reputation: 337560

Try moving the .colourPicker() initialisation inside the success callback of the ajaxForm plugin. This will then be exectued after the AJAX request has completed:

$(document).ready(function() {      
    $('#photoimg').live('change', function() { 
        $("#preview").html('');
        $("#preview").html('<img src="loader.gif" alt="Uploading...."/>');
        $("#imageform").ajaxForm({
            target: '#preview',
            success: function() {
                $('#color1').colorPicker();
            }
        }).submit();
    });
});

Upvotes: 4

Related Questions