使用网格列填充下拉列表

时间:2013-09-16 13:15:14

标签: c# .net kendo-ui kendo-grid kendo-asp.net-mvc

我的网格工具栏中有一个下拉列表。我想用该网格的列名填充下拉列表。有什么建议?

 @(Html.Kendo().Grid(Model)    
.Name("Grid")
.Columns(columns =>
{
    columns.Bound(p => p.Name).Groupable(false);
    columns.Bound(p => p.FullName);
    //columns.Command(commandAction: command => command.Custom("ViewDetails").Click("showDetails"));
})

.DataSource(dataSource => dataSource
    .Ajax()
    .Read(read => read.Action("Customers_read", "jvIndex"))

    .PageSize(1)
)


.ToolBar(toolbar =>
{

    toolbar.Template(@<text>
                          <div class="toolbar">


                              <input type="text" class="k-input"/>
                                  @(Html.Kendo().DropDownList()
                                  .Name("categories")
                                  .OptionLabel("All")
                                  .DataTextField("")
                                  .DataValueField("")

                                  .Events(e=>e.Change("categoriesChange"))
                                  .BindTo()
                                  )

                               <button class="k-button" id="get">Filter</button>

                          </div>
                      </text>);

})
.HtmlAttributes(new { style = "height: 430px" })
.Pageable()
.Sortable()
.Scrollable()
.DataSource(dataSource => dataSource
    .Ajax()
    .PageSize(20)
    .ServerOperation(false)
    .Model(model => model.Id(p => p.Name))
    .Read("ToolbarTemplate_Read", "jvIndex")
)

) )

3 个答案:

答案 0 :(得分:1)

您可以使用此代码检索列名数组。

var grid = $("#grid").data("kendoGrid");
var columns = grid.columns;

// Add them to the dropdown list, maybe something like this:
$("#categories").data("kendoDropDownList").dataSource.data(columns);

答案 1 :(得分:1)

试试这个,

 .ToolBar(toolbar =>
    {
        toolbar.Template(@<text>
           <div class="toolbar">
                   <input type="text" class="k-input"/>
                                  @(Html.Kendo().DropDownList()
                                  .Name("categories")
                                  .OptionLabel("All")
                                  .DataTextField("Text")
                                  .DataValueField("Value")
                            .AutoBind(false)
                            .Events(e => e.Change("categoriesChange"))
                            .DataSource(ds =>
                            {
                                ds.Read("column", "Grid");
                            })
                        ) 
                        </div>
        </text>);
    })

<强>控制器

 public ActionResult column()
        {

            // your get column method 

            return Json(column, JsonRequestBehavior.AllowGet);
        }

答案 2 :(得分:0)

我尝试了同样的事情而没有太多运气......最后只使用数据表作为网格的模型,然后我们可以迭代模型的列名来填充下拉列表。