CODEWITHSUNDEEP
jqueryfile-io
Newbie
Newbie

Reputation: 473

moving a div with input[file] and selected value to another div

I have the following html

<div class="item">
    <input id="Document_0_UpFile" name="Documents[0].UpFile" type="file" value="">
</div>

and on the same page i have the following div

<div id="allItems"></div>

I want to be able to move the input file from item to the div #allItems with the selected value using jquery.

i've tried the following but they don't seem to retain the value of the selected file

 $('#addItem').on('click', function (e) {
   var inputs = $("div.item").clone();
   $("#docList").append(inputs);
}


 $('#addItem').on('click', function (e) {
   $("#docList").append($("div.item").html());
}

If anyone can help direct me that would be awesome.

Upvotes: 2

Views: 3254

Answers (1)

Kenneth
Kenneth

Reputation: 28737

You'd need to move the current item and then create a new item in the place where you moved the current item from:

HTML

<div class="item">
    <input id="Document_0_UpFile" name="Documents[0].UpFile" type="file" value="" />
</div>
<input type="button" id="addItem" value="move">
<div id="allItems"></div>

Script

$('#addItem').on('click', function (e) {
    var inputs = $("div.item input");
    $("#allItems").append(inputs);
    $("div.item").append(" <input type=\"file\"  />");
});

Check out this fiddle: http://jsfiddle.net/Kennethtruyers/5ecPw/1/

Upvotes: 5

Related Questions