试图动态asp：FileUpload，刷新故障

Question

我需要我的网络系统的用户做上传（最多4个）。

上传本身其工作，但我不希望所有的盒子在开始，所以试图隐藏第二，第三和第四上传框，直到用户需要他们。

这里的ASPX代码部分

<fieldset> 
    <div class="frm tam"> 
    </div> 
    <div class="lin"> 
     <asp:FileUpload ID="FileUpload1" runat="server" /></div> 
    <div class="lin"> 
     <asp:FileUpload ID="FileUpload2" runat="server" Visible="false" /></div> 
    <div class="lin"> 
     <asp:FileUpload ID="FileUpload3" runat="server" Visible="false" /></div> 
    <div class="lin"> 
     <asp:FileUpload ID="FileUpload4" runat="server" Visible="false" /></div> 
    <div class="lin"> 
     <asp:Button ID="btnUpload" runat="server" Text="Upload"OnClick="btnUpload_Click" /> 
     <asp:Button ID="btnAdd" runat="server" Text="ADD File" OnClick="btnAdd_Click" /> 
     <asp:Button ID="btnRem" runat="server" Text="Remove File" OnClick="btnRem_Click" /> 
    </div> 
</fieldset> 

和后面的代码显示和隐藏的箱子

protected void btnAdd_Click(object sender, EventArgs e) 
{ 
    if (FileUpload2.Visible == false) 
    { 
     FileUpload2.Visible = true; 
    } 
    else if (FileUpload3.Visible == false) 
    { 
     FileUpload3.Visible = true; 
    } 
    else if (FileUpload4.Visible == false) 
    { 
     FileUpload4.Visible = true; 
    } 
} 

protected void btnRem_Click(object sender, EventArgs e) 
{ 
    if (FileUpload4.Visible == true) 
    { 
     FileUpload4.Visible = false; 
    } 
    else if (FileUpload3.Visible == true) 
    { 
     FileUpload3.Visible = false; 
    } 
    else if (FileUpload2.Visible == true) 
    { 
     FileUpload2.Visible = false; 
    } 
} 

，当我在添加文件点击，新的框出现，但选择的文件路径其他的盒子被清除。我可以避免这种情况吗？

*编辑：我使用网络框架4.0。

Answer 1

该文件在回发中丢失。或者，您可以通过JavaScript实现该功能

<div id="div1"> 
    <asp:FileUpload ID="FileUpload1" runat="server" /> 
</div> 

<div id="div2" style="display:none"> <!-- visibility:hidden --> 
    <asp:FileUpload ID="FileUpload2" runat="server" /> 
</div> 

<div id="div3" style="display:none"> 
    <asp:FileUpload ID="FileUpload3" runat="server" /> 
</div> 

<div id="div4" style="display:none"> 
    <asp:FileUpload ID="FileUpload4" runat="server" /> 
</div> 

然后将每个FileUpload控件放在每个div中。

<input type="button" valud="Add" onclick="addControls()" /> 

然后用JavaScript来使其可见

function addControls() 
{ 
    document.getElementById('div2').style.display = 'inline-block'; 
    //$('#div2').show(); <--- JQuery 
} 

Answer 2

这个值丢失这里的问题是，上传文件的工作方式略有不同，以最输入控件...

不是张贴输入文件路径值，它实际上张贴在回发的文件内容，以便 。

在我看来，像你最好的选择是在客户端上用javascript做些事情来显示/隐藏这些上传控件。这也将是更好的用户体验，因为用户不必每次都等待回发。

你可以使用jQuery做这个...

http://jsfiddle.net/BAwfH/2/

<fieldset> 
<div class="frm tam"> 
</div> 
<div class="lin"> 
    <asp:FileUpload ID="FileUpload1" runat="server" /> 
</div> 
<div class="lin"> 
    <asp:FileUpload ID="FileUpload2" runat="server" /> 
</div> 
<div class="lin"> 
    <asp:FileUpload ID="FileUpload3" runat="server" /> 
</div> 
<div class="lin"> 
    <asp:FileUpload ID="FileUpload4" runat="server" /> 
</div> 
<div> 
    <asp:Button ID="btnUpload" runat="server" Text="Upload"OnClick="btnUpload_Click" /> 
    <asp:Button ID="btnAdd" class="add-button" runat="server" Text="ADD File" OnClick="btnAdd_Click" /> 
    <asp:Button ID="btnRem" runat="server" Text="Remove File" OnClick="btnRem_Click" /> 
</div> 

<script type="text/javascript"> 
$(document).ready(function(){ 
var lines = $('.lin'); 
lines.hide(); 
lines.filter(':first').show(); 

$('.add-button').click(function(){ 
    lines.filter(':hidden:first').show(); 

    if(lines.filter(':hidden').length == 0) 
     $(this).hide(); 
}); 

}）;