Kendo ui 剑道Ui网格编辑弹出窗口中有多个列

我在asp.net核心MVC项目中使用Telerik的Kendo UI数据网格，但是我不知道如何让编辑弹出窗口显示2列或更多列，以便文本框可以并排显示。我知道我需要一个视图模型来显示自定义，但如何在自定义编辑弹出窗口中创建2行

@(Html.Kendo().Grid<Stock>()
    .Name("Grid")
    .Columns(columns =>
    {
        columns.Bound(p => p.ID);
        columns.Bound(p => p.Description).Width(180);
        columns.Bound(p => p.Name).Width(180);
        columns.Command(command => command.Edit()).Width(160);
        columns.Command(command => command.Destroy()).Width(160);
    })

.ToolBar(toolbar =>
 {
     toolbar.Create();
     toolbar.Save();
 })
.Editable(editable => editable.Mode(GridEditMode.PopUp))
.Pageable()
.Navigatable()
.Sortable()
.Groupable()
.Filterable()
.Scrollable()
.HtmlAttributes(new { style = "height: 500px" })
.DataSource(dataSource => dataSource
    .Ajax()
    .PageSize(20)

    .ServerOperation(false)
    .Events(events => events.Error("error"))

      .Model(model =>
      {
          model.Field(p => p.ID).Editable(true);
          model.Field(p => p.Name);
      })

    .Read("ReadStock", "Stock")
    .Update("Stock_Update", "Stock"))

   )
)

---

对于基本UI之外的任何内容，都需要创建自己的编辑器tempate。示例项目是。网格定义，模板定义。可能会找到更好的例子。这是一个很好的网格，概念简单。我的boostrap不如c#我如何在该场景中并排创建两个文本字段@SteveGreene@SteveGreene我把表格整理好了谢谢但出于某种原因，弹出窗口没有点击我的更新命令，不知什么原因，你不知道为什么会有重复的

.Editable（…）

，并且不确定你是否需要

.ServerOperation（false）

或

AcceptVerbs

。确保引用了

kendo.aspnetmvc.min.js

。

@(Html.Kendo().Grid<Stock>()
        .Name("Grid")
        .Columns(columns =>
        {
            columns.Bound(p => p.ID);
            columns.Bound(p => p.Description).Width(180);
            columns.Bound(p => p.Name).Width(180);
            columns.Command(command => command.Edit()).Width(160);
            columns.Command(command => command.Destroy()).Width(160);
        })

    .ToolBar(toolbar =>
     {
         toolbar.Create();
         toolbar.Save();
     })
    .Editable(editable => editable.Mode(GridEditMode.PopUp))
    .Pageable()
    .Navigatable()
    .Sortable()
    .Groupable()
    .Filterable()
    .Scrollable()
    .HtmlAttributes(new { style = "height: 500px" })
    .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(20)

        .ServerOperation(false)
        .Events(events => events.Error("error"))

          .Model(model =>
          {
              model.Field(p => p.ID).Editable(true);
              model.Field(p => p.Name);
          })

        .Read("ReadStock", "Stock")
        .Update("Stock_Update", "Stock"))
    .Editable(ed => ed.Mode(GridEditMode.PopUp).TemplateName("StockEditorTemplate"))


       )
    )

@model RoundTableDal.Models.Stock
@using Kendo.Mvc.UI
<div class="k-edit-form-container">
    <h3>Customized Stock Edit</h3>
    <br />
    @Html.HiddenFor(model => model.ID)

    <div class="k-edit-label">
        @Html.LabelFor(model => model.Name)
    </div>
    <div class="k-edit-field">
        @Html.EditorFor(model => model.Name)
        @Html.ValidationMessageFor(model => model.Name)
    </div>

    <div class="k-edit-label">
        @Html.LabelFor(model => model.StartDate)
    </div>
    <div class="k-edit-field">
        @Html.Kendo().DateTimePickerFor(model => model.EndDate)
        @Html.ValidationMessageFor(model => model.EndDate)
    </div>
</div>

[AcceptVerbs("Post")]
public async Task<ActionResult> Stock_Update([DataSourceRequest] DataSourceRequest request, Stock stockItem)    {
        if (stockItem != null && ModelState.IsValid)            {
            int x = await apiClient.PostUpdateStock(stockItem);
        }

        return Json(new[] {stockItem}.ToDataSourceResult(request, ModelState));
}

app.UseEndpoints(endpoints =>    {
   endpoints.MapControllerRoute(
   name: "default",
   pattern: "{culture=en-gb}/{controller=Home}/{action=Index}/{id?}");
   endpoints.MapRazorPages(); }); in my root path.