问题描述
我有一个数据网格,其中表上的每个项目都需要附加一个或多个文档。当您单击最后一列按钮时,您应该打开一个弹出窗口,然后该弹出窗口具有文件上传器。
我试图在Datagrid中创建自定义按钮,这将打开具有FileUploader小部件的自定义弹出窗口,但是该按钮根本无法呈现。
这是结果,而不是显示的按钮。
\[%!function(){%\]\ [%DevExpress.aspnet.createComponent("dxButton",{"text":"Attach","onClick":function (e) { attachButtonClick(data) }},arguments\[0\])%\]\[%}("dx-" + new DevExpress.data.Guid())%\]
我想即使弹出窗口也会出现同样的情况。仅此文字似乎代表文件上传器。 这是我这部分的.chtml代码。
@(Html.DevExtreme().DataGrid<myModel>()
.ID("dataGrid")
.DataSource(ds => ds.Mvc().Controller("DataGridMaterials")
.LoadAction("Get")
.InsertAction("Insert")
.UpdateAction("Update")
.DeleteAction("Delete")
.Key("ID")
)
.Columns(columns => {
columns.AddFor(m => m.Equipment);
columns.AddFor(m => m.Client);
columns.AddFor(m => m.Number);
columns.AddFor(m => m.Address);
columns.AddFor(m => m.Phone);
columns.Add().Width(160).Alignment(HorizontalAlignment.Center).CellTemplate(@<text>
@Html.DevExtreme().Button().Text("Attach").OnClick("function (e) { attachButtonClick(data) }")
</text>);
})
.OnRowDblClick(@<text>
function MyHandler(selectedItem) {
var dataGrid = $("#dataGrid").dxDataGrid("instance");
var selectedRowsData = dataGrid.getSelectedRowsData();
var allData = selectedRowsData[0];
var id = allData.ID;
console.log(id);
$('#customPopup').dxPopup('instance').option('visible',true);
}
</text>)
.RowAlternationEnabled(true)
.Editing(editing => {
editing.Mode(GridEditMode.Row);
editing.AllowUpdating(true);
editing.AllowDeleting(true);
editing.AllowAdding(true);
})
.Selection(s => s.Mode(SelectionMode.Single))
.RemoteOperations(true)
)
@(Html.DevExtreme().Popup().ID("customPopup").Width(660).Height(540).Title("Attachments").Visible(false)
.ContentTemplate(@<text>
@(Html.DevExtreme().FileUploader()
.ID("file-uploader")
.Name("myFile")
.Multiple(true)
.Accept("*")
.UploadMode(FileUploadMode.UseButtons)
.UploadUrl(Url.Action("Upload","FileUploader"))
.OnValueChanged("fileUploader_valueChanged")
)
</text>)
)
我的解决方案基于此示例应用程序。 View
解决方法
很奇怪,我遵循您提供的示例代码,它可以在我这边工作。我正在使用Asp.net core 3.1
和Devextreme 20.1
:
@model Order
@{
ViewBag.Title = "Index";
}
<h2>Home</h2>
@(Html.DevExtreme().DataGrid<Order>()
.ID("gridContainer")
.ShowBorders(true)
.DataSource(d => d.Mvc().Controller("Orders").LoadAction("Get").Key("OrderID").UpdateAction("Put"))
.Columns(columns => {
columns.AddFor(m => m.CustomerName);
columns.AddFor(m => m.OrderDate);
columns.AddFor(m => m.ShipCity);
columns.Add().Width(160).Alignment(HorizontalAlignment.Center).CellTemplate(@<text>
@Html.DevExtreme().Button().Text("Attach").OnClick("function (e) { attachButtonClick() }")
</text>);
})
.Selection(s => s.Mode(SelectionMode.Single))
.RemoteOperations(true)
)
@(Html.DevExtreme().Popup().ID("customPopup").Width(660).Height(540).Title("Attachments").Visible(false)
.ContentTemplate(@<text>
@(Html.DevExtreme().FileUploader()
.ID("file-uploader")
.Name("myFile")
.Multiple(true)
.Accept("*")
.UploadMode(FileUploadMode.UseButtons)
.UploadUrl(Url.Action("Upload","FileUploader"))
)
</text>)
)
<script>
function attachButtonClick() {
$('#customPopup').dxPopup('instance').option('visible',true);
}
</script>