Отключение одного столбца сетки кендо

У меня есть приложение, в котором у меня есть KendoGrid, в котором есть 2 столбца. В первом столбце я добавляю метку на основе условия. Теперь я хочу отключить этот столбец для каждой строки. Я использую Incell Editing для редактирования данных столбца, поэтому, когда я нажимаю на первый столбец во время редактирования через InCell Editing of KendoGrid, он должен быть отключен, то есть не должен редактироваться. здесь Мой код, как показано ниже:

@(Html.Kendo().Grid(Model)
            .Name("Remark")
            .TableHtmlAttributes(new { style = "height:20px; " })
            .Columns(columns =>
            {
                columns.Bound(p => p.RemarkID).Hidden(true).ClientTemplate("#= RemarkID#" + "<input type='hidden' class='RemarkID' value='#=RemarkID#' />");
                //columns.Bound(p => p.RemarkCode).Title("Remark Code").Width(3).ClientTemplate("#= RemarkCode#" + "<input type='hidden' class='RemarkCode' value='#=RemarkCode#' />");
                columns.Bound(p => p.RemarkDescription).Title("Type").Width(10).ClientTemplate("#= RemarkDescription#" + "<input type='hidden' class='RemarkDescription' value='#=RemarkDescription#' />");
                columns.Bound(p => p.Remark).Title("Remark").Width(50).ClientTemplate("#= Remark#" + "<input type='hidden' class='Remark' value='#=Remark#' />");

            })
            .Editable(editable => editable.Mode(GridEditMode.InCell))

            .Navigatable()
            .Sortable()
            .Scrollable(scr => scr.Height(200))
            .Scrollable()
            .DataSource(dataSource => dataSource
                .Ajax()
                .Batch(true)
                .ServerOperation(false)
                .Events(events => events.Error("error_handler"))
                      .Model(model =>

                   model.Id(p => p.RemarkID)

               )
                .Create("Editing_Create", "Grid")
                .Read("Remark_Read", "Document")
                .Update("Editing_Update", "Grid")
                .Destroy("Editing_Destroy", "Grid")
                )
        )

 $(".AddNewRemark").click(function () {
            //grid.addRow();
            var dataSource = grid.dataSource;
            var total = dataSource.data().length;
            dataSource.insert(total, {});
            dataSource.page(dataSource.totalPages());
            grid.editRow(grid.tbody.children().last());

            var it = $(this).text().trim();
            $("#RemarkDescription").val(it);

            $("#RemarkDescription").attr('readonly', 'readonly');
            grid.dataSource._data[total].RemarkDescription = it;



            for(var i=0;i<=total;i++){

                grid.dataSource.at(i).fields["RemarkDescription"].editable=false;


            }


        });

javascript jquery asp.net-mvc kendo-grid kendo-ui
person SantyEssac    schedule 23.01.2014    source источник

Ответы (2)


arrow_upward
3
arrow_downward

Попробуйте это, это просто пример,

        <script>
            $(document).ready(function () {
                var crudServiceBaseUrl = "http://demos.kendoui.com/service",
                    dataSource = new kendo.data.DataSource({
                        transport: {
                            read:  {
                                url: crudServiceBaseUrl + "/Products",
                                dataType: "jsonp"
                            },
                            update: {
                                url: crudServiceBaseUrl + "/Products/Update",
                                dataType: "jsonp"
                            },
                            destroy: {
                                url: crudServiceBaseUrl + "/Products/Destroy",
                                dataType: "jsonp"
                            },
                            create: {
                                url: crudServiceBaseUrl + "/Products/Create",
                                dataType: "jsonp"
                            },
                            parameterMap: function(options, operation) {
                                if (operation !== "read" && options.models) {
                                    return {models: kendo.stringify(options.models)};
                                }
                            }
                        },
                        batch: true,
                        pageSize: 20,
                        schema: {
                            model: {
                                id: "ProductID",
                                fields: {
                                    ProductID: { editable: false, nullable: true },
                                    ProductName: { validation: { required: true },editable: false, },
                                    UnitPrice: { type: "number", validation: { required: true, min: 1} },
                                    Discontinued: { type: "boolean" },
                                    UnitsInStock: { type: "number", validation: { min: 0, required: true } }
                                }
                            }
                        }
                    });

                $("#grid").kendoGrid({
                    dataSource: dataSource,
                    navigatable: true,
                    pageable: true,
                    height: 430,
                    toolbar: ["create", "save", "cancel"],
                    columns: [
                        "ProductName",
                        { field: "UnitPrice", title: "Unit Price", format: "{0:c}", width: 110 },
                        { field: "UnitsInStock", title: "Units In Stock", width: 110 },
                        { field: "Discontinued", width: 110 },
                        { command: "destroy", title: "&nbsp;", width: 90 }],
                    editable: true
                });
            });
        </script>
    </div>

Если вы хотите Disable один столбец в сетке редактирования Incell, используйте editable: false для этого столбца.

Если вы используете свойство editable: false для столбца сетки и хотите добавить новый элемент в эту сетку, ваш первый столбец всегда должен быть Disabled. И я не знаю ответов для синтаксиса Razor.

person Jaimin    schedule 23.01.2014

arrow_upward
0
arrow_downward

Сделайте доступным для редактирования значение false в объявлении схемы для того конкретного столбца, который вы хотите отключить.

person Community    schedule 24.01.2014