javascript - 在 FileUpload 组件中选择文件时在页面上启用按钮

Question

我在我的 ASP.NET 4.0 页面上使用了一个 FileUpload 组件，我还有一个按钮来开始实际上传文件。

现在，如果我可以禁用 Upload 按钮，那就太好了，直到在 FileUpload 控件中选择了一个有效文件 - 但我似乎无法找到任何方法来做到这一点。

我不是客户端脚本大师 - 但我想知道我是否可以连接一些 Javascript“voodoo”来检测是否已在 FileUpload 组件中选择了一个文件，并且然后启用页面上的 Upload 按钮。

有人做过吗？如果是这样:你究竟是怎么做到的？我被难住了，只见树木不见森林……

Answer 1

FileUpload 有一个 value 属性，您可以使用...

function ValidateUpload()
{
  var fuData = document.getElementById('fuUploadControl');

  if (fuData.value == '')
  {
       return false;
  }
  else
  {
       document.getElementById('btnSubmit').style.display = "";
  }
  return true;

}

我从 CustomValidator 运行这个函数(用于验证我的 FileUpload 控件)...
如果验证成功(例如，选择了一个文件)，将显示该按钮(默认情况下它开始不可见)

ASPX代码:

<asp:FileUpload ID="fuUploadControl" runat="server" />
<asp:Button ID="btnSubmit" runat="server" Text="Upload" 
            OnClick="btnSubmit_Click" Style="display: none;" />
<asp:CustomValidator ID="CustomValidator1" runat="server"   
                     ControlToValidate="fuUploadControl"
                     ClientValidationFunction="ValidateUpload" />