Grid string column Read Only with inline editing MVC

10 posts, 0 answers
  1. pat
    pat avatar
    2 posts
    Member since:
    Aug 2012

    Posted 10 Aug 2012 Link to this post

    Hi,

    I have a kendo grid MVC with inline editing. I would like to put a column read only.

    My code for my column
    columns.Bound(p => p.Name).Title("Job").EditorTemplateName("ReadOnlyTemplate");

    and for my ReadOnlyTemplate

    @model string
    @(Html.LabelFor(m => m))

    In my column, ok it's readonly but the Name is the header of the Header, not the value.

    Thank tou for your help !
  2. Kenneth
    Kenneth avatar
    27 posts
    Member since:
    Nov 2010

    Posted 02 Sep 2012 Link to this post

    Read about it here: DataSource Configuration
  3. Bram
    Bram avatar
    8 posts
    Member since:
    May 2012

    Posted 23 Apr 2013 Link to this post

    I have similar problem, I cant modify the model (it is loaded before setting this customization), so is there already an other option ?
  4. Dimiter Madjarov
    Admin
    Dimiter Madjarov avatar
    2312 posts

    Posted 26 Apr 2013 Link to this post

    Hello,


    As mentioned in the above post, you could specify a column as readonly in the model configuration with the Editable(false) option.
    E.g.
    .DataSource(dataSource => dataSource
        .Ajax() // or .Server()
        .Model(model =>
        {
            ...
            // Declare a model field and make it readonly
            model.Field(p => p.UnitPrice).Editable(false);
        })
    )


    If that is not an option in the current scenario, you should use an alternative approach. For example with inline editing you could bind to the edit event of the Grid, perform the custom checks and disable the editor for the column. With batch editing you could bind to the click event of the cells and stop the event propagation if needed.

    I hope this information will help you to solve the issue.

     

    All the best,
    Dimiter Madjarov
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  5. Bram
    Bram avatar
    8 posts
    Member since:
    May 2012

    Posted 26 Apr 2013 Link to this post

    Hi Dimiter,
    Now I have:

    .Model(model =>
       {
            foreach (var column in Model.CPMMetaColumnData)
            {
                model.Field(column.ColumnName, column.SystemDataType).Editable(!column.ColumnisReadOnly);
            };
            model.Id("ID");
        })


    Where ReadOnly is filled with a bool. But the columns are still editable. I can't link with function ( c=>c.column), because the metadata is leading for displaying the columns.
    What I'm doing wrong ?

    Kind regards,

    Paul

    Using latest internal build (419)




    Total declaration:


    @model CPMPlanning.Models.CPMDataView
     
    @(Html.Kendo().Grid(Model.CPMColumnData)
        .Name("MaintGrid")
        .Columns(columns =>
        {
            //int i = 0;
     
            //foreach (var col in Model.CPMMetaColumnData)
            //{
            //    columns.Bound(col.ColumnBound);
            //    i++;
            //};
            columns.LoadSettings((IEnumerable<GridColumnSettings>)Model.CPMGridColumnSettings);
            columns.Bound("ID").Hidden();
        })
        .Editable(e => e.Mode(GridEditMode.InCell))
        .Pageable()
        .Sortable()
        .Scrollable(s=> s.Height("auto"))
        .Filterable()
        .Groupable()
        .Navigatable()
        .ToolBar(toolbar => {
            toolbar.Create();
            toolbar.Save();       
        })
        .DataSource(dataSource => dataSource
            .Ajax()
            .Batch(true)
            .Model(model =>
               {
                    foreach (var column in Model.CPMMetaColumnData)
                    {
                        model.Field(column.ColumnName, column.SystemDataType).Editable(!column.ColumnisReadOnly);
                    };
                    model.Id("ID");
                })
            .Read(read => read.Action("__Read", "CPMMaint", new { id = Model.TableID }))
            .Update(update => update.Action("__Update", "CPMMaint", Model))
            .Create(insert => insert.Action("__Insert", "CPMMaint"))
            .Destroy(delete => delete.Action("__Delete", "CPMMaint"))
            .Events(events => events.RequestEnd("onGridRequestEnd"))
            .PageSize(ViewBag.PageSize)
             
        )
    )
     
    <script>
        function onGridRequestEnd(evt) {
            if (evt.type === "update") {
                evt.sender.read();
            }
        }
    </script>
  6. Petur Subev
    Admin
    Petur Subev avatar
    1882 posts

    Posted 01 May 2013 Link to this post

    Hello Pat,

    What happens if you hard-code the loop to always assign false to the Editable option of each field, does it make any difference?

    Since the code you shared looks valid ,to investigate further please put this into a small demo project which we can run and see what exactly goes wrong (you can pick a project from the code library and modify it).

    Thank in advance for the cooperation.

    Kind Regards,
    Petur Subev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  7. Bram
    Bram avatar
    8 posts
    Member since:
    May 2012

    Posted 01 May 2013 Link to this post

    Hi Petur,

    I've solved the problem already, but thanks for your reply, I've solved it because I've set the property editable to the wrong columns (I used the column-title instead of the boundcolumnname).

    Grtz,

    Paul 
  8. Robert
    Robert avatar
    9 posts
    Member since:
    Jan 2013

    Posted 26 Sep 2015 in reply to pat Link to this post

    @model string
    @Html.TextBoxFor(x => x, new { @readonly = true })

     

    easiest

  9. Dan
    Dan avatar
    15 posts
    Member since:
    Dec 2017

    Posted 06 Sep 2020 in reply to Dimiter Madjarov Link to this post

    you mention that it is possible to making specific columns "read-only" in the edit event of the grid.  I have a situation for which I use in-line editing but cannot set the model to Editable(false) for one specific column.  Can you provide an example?  fyi, I am using the .NET core version of the grid.
  10. Neli
    Admin
    Neli avatar
    397 posts

    Posted 09 Sep 2020 Link to this post

    Hi Dan,

    You could use the example from Grid API regarding the edit event. The first example demonstrates how to prevent editing for a specific column. The example uses popup editing but the same approach could be used with inline editing. 

     edit: function(e) {
        if (!e.model.isNew()) {
          // Disable the editor of the "id" column when editing data items
          var numeric = e.container.find("input[name=id]").data("kendoNumericTextBox");
          numeric.enable(false);
        }
      }

     

    Here is a Dojo example where the inline editing is used.

    I hope the provided information will be helpful.

    Regards,
    Neli
    Progress Telerik

    Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Back to Top