how to update image src on success using jquery.form.js

Question

i am using jquery.form.js to ajax submit form and get response.

my php page is set to echo image url like "images/thumbs/071112130957.jpg"

heres my jquery:

$("#imageform").ajaxForm(
{ 
target: '#preview'
}).submit();
});

heres my html form

<form action="cropscript.php" id="imageform" method="post" enctype="multipart/form-data">
<input type="file" name="image" id="image" /> <br/>
<input type="submit" name="submit" value="upload image" />
</form>

<div id="preview" > </div>
<img src = "thumbs/default.jpg" id="thumb_img" />

now my question is how do i update the img#thumb_img src after ajaxform success ?

Answer 1

this was what worked for me.

$(document).ready(function() { 
    $('#image').live('change', function()   
    { 
            $("#imageform").ajaxForm({ 
                    target: '#preview',
                    dataType: 'json',
                    success : function (response) {
                                $('#thumb_img').attr('src','images/thumbs/'+response.imgsrc);
                    }
            }).submit();

    });
}); 

Answer 2

i use ajaxFrom long time ago but it just pop in my head
please check document with your version

$('#imageform').ajaxForm({
  target : '#preview', 
  complete : function (response) {
     $('#thumb_img').attr('src', response.imgsrc);
  }
});

can you test for me if not work let me know