我正在使用Infragistics IgniteUI 2014.1。
我在页面上有一个 igFileUpload 控件,允许用户上传文件。该控件最初是一个简单的"上传文件"按钮,但一旦选择文件,它就会更改为显示进度条、取消按钮等(此行为内置于控件中)。如果用户上传 x 个文件,将显示 x 个进度条。
我的问题是我需要一种方法来重置 UI,以便在用户完成上传文件后显示简单的"上传文件"按钮,而无需进度条。
以下是相关标记:
<div class="col-md-12">
<div id="DIVUploadNewFile" class="form-group">
<label class="control-label" for="FUNewFile">Upload New File</label>
<div id="FUNewFile"></div>
</div>
</div>
我尝试删除表示 igFileUpload 控件的 DOM 元素,然后将其添加回页面并通过以下方式重新初始化它:
// remove the FileUpload div
$("#FUNewFile").remove();
// add the FileUpload div back to the document
$("#DIVUploadNewFile").append($("<div id='FUNewFile'></div>"));
// reinitialize the FileUpload control in exactly the same way that
// I have always done on $(document).ready()
$("#FUNewFile").igUpload({
mode: 'multiple',
multipleFiles: true,
maxUploadedFiles: 5,
autostartupload: true,
progressUrl: "IGUploadStatusHandler.ashx",
maxSimultaneousFilesUploads: 2,
controlId: "serverID1"
});
当我在运行此代码后检查页面时,igFileUpload 控件无处可寻。
您可以销毁,然后重新创建小部件。删除内部 DOM 不会删除小部件。你可以做这样的事情:
if ($("#FUNewFile").data("igUpload")) {
$("#FUNewFile").igUpload("destroy");
}
$("#FUNewFile").igUpload({
mode: 'multiple',
multipleFiles: true,
maxUploadedFiles: 5,
autostartupload: true,
progressUrl: "IGUploadStatusHandler.ashx",
maxSimultaneousFilesUploads: 2,
controlId: "serverID1"
});