Change the input value via jQuery when image uploaded [uploadify]

Question

I am using uploadify, everything works but i want to change my hidden input value to uploaded filename once it gets uploaded. There are 5 image, i am uploading at a time, and i want to append them one after one.

<input type="file" id="file_upload" name="file_upload" />
<input type="hidden" name="image1" id="image1" />
<input type="hidden" name="image2" id="image5" />
<input type="hidden" name="image3" id="image3" />
<input type="hidden" name="image4" id="image4" />
<input type="hidden" name="image5" id="image5" />

and this is my uploadify script :-

<?php $timestamp = time();?>
            $(function() {
            $('#file_upload').uploadifive({
            'auto'             : false,
            'multi'             : true,
            'fileType'     : 'image',
            'queueSizeLimit' : 5,
            'formData'         : {
                   'timestamp' : '<?php echo $timestamp;?>',
            'token'     : '<?php echo md5('unique_salt' . $timestamp);?>'
            },
            'queueID'          : 'queue',
            'uploadScript'     : 'uploadifive.php',
            'onUploadComplete' : function(file, data) { 
alert('The File ' + file.name + " has been uploaded");}
        });
});

Once upload has completed, I want to change all hidden input field with respective images name.

something like :- $("$image1").attr('src', file.name);

but one by one to all ? How can i do them.

Thanks

Christian Phillips · Accepted Answer · 2013-10-01 12:59:57Z

1

You could use the .appendTo() or .html() in jQuery, so instead of having the hidden values above, use a div and append to the div as they load...

<div id="images"></aid>

build your html..

$("#images").html('<img src="' + file.name+ '" />');

...or...

$("#images").appendTo('<img src="' + file.name+ '" />');

answered Oct 1, 2013 at 12:59

Christian Phillips

18.8k8 gold badges55 silver badges85 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Christian Phillips Over a year ago

OK, well it might be useful down the line for others that come across the post :)

John Cargo Over a year ago

$('#images').attr('src', file.name); & $('#images').val(file.name); did a better job for my solution :)

Christian Phillips Over a year ago

How did you target the individual hidden fields though?

John Cargo Over a year ago

$('#images').val(file.name);

Collectives™ on Stack Overflow

Change the input value via jQuery when image uploaded [uploadify]

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related