我正在尝试一个简单的Web应用程序。我有数据并在kendo网格中显示多列(DocumentCategory,ShortDescription,FileName,DocumentType和FileSize)其他列是EDIT和DELETE。当我单击EDIT打开弹出窗口并显示DocumentCategory,ShortDescription,DocumentType但我无法在文件输入中显示存在的文件。我把文件输入属性(data-bind =" value:fileName")放在里面,但它不起作用。我怎么能这样做?
这是我的弹出窗口HTLM代码。
<div id="static" class="modal fade" tabindex="-1" data-backdrop="static" data-keyboard="false" aria-hidden="true" style="display: none;">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<form id="documentForm" data-bind="with:model">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
<h4 class="modal-title">@T("Admin.Language.Add")</h4>
</div>
<div class="modal-body">
<div class="alert alert-danger display-hide">
<button class="close" data-close="alert"></button>@T("Admin.FillRequiredFields.Message")
<ul id="errors"></ul>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">@T("Admin.Document.Type")</label>
<div class="col-md-10">
<select data-bind="options: $root.documentTypes, optionsText: 'value',optionsValue: 'key', value:documentType, optionsCaption: '@T("Choose")'" class="sbs-select form-control" name="type"></select>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">@T("Admin.Document.DocumentCategory")</label>
<div class="col-md-10">
<select data-bind="options: $root.documentCategories, optionsText: 'nameString',optionsValue: 'id', value:documentCategoryId, optionsCaption: '@T("Choose")'" class="sbs-select form-control" name="parentId"></select>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 control-label">@T("Admin.Document.Description")</label>
<div class="col-md-10">
<input type="text" class="form-control" name="description" data-bind="value:description" />
</div>
</div>
// Here is File Input
<div class="form-group row">
<label class="col-md-2 control-label">@T("Admin.Document.File")</label>
<div class="col-md-10">
<input id="fileLoader" type="file" class="file" name="document">
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" data-dismiss="modal" data-bind="click: $root.closePopup" class="btn default">@T("Cancel")</button>
<button type="button" class="btn green" data-bind="click: $root.saveLang">@T("Save")</button>
</div>
</form>
</div>
</div>
</div>
&#13;
function updateRow(me) {
var model = getRowAsModel(me);
ko.contextFor(document.getElementById("container")).$data.openPopup(model);}
&#13;
这是我的JS代码
self.model = ko.observable({
description: ko.observable(),
documentCategory: ko.observable(),
documentCategoryId: ko.observableArray(),
documentType: ko.observable(),
documentTypeId: ko.observable(),
fileName: ko.observable(),
fileSize: ko.observable(),
id: ko.observableArray()
});
self.openPopup = function (data) {
$("#static").modal("show");
if (data.id) {
self.model().id(data.id);
self.model().fileSize(data.fileSize);
self.model().fileName(data.fileName);
self.model().documentTypeId(data.documentTypeId);
self.model().documentType(data.documentType);
self.model().documentCategoryId(data.documentCategoryId);
self.model().documentCategory(data.documentCategory);
self.model().description(data.description);
}
}
self.closePopup = function () {
$("#static").modal("hide");
reset(self.model, []);
}
&#13;
这是弹出窗口的截图