How to set editable mode of a particular cell

8 posts, 0 answers
  1. Joseph
    Joseph avatar
    11 posts
    Member since:
    Mar 2014

    Posted 09 May 2014 Link to this post

    Hi,

    I would like to set the editable mode to true for a particular Cell in Kendo UI MVC Grid.

    I am able to set the editable of the Column. But I wan to set edit mode for a particular cell.

    Can any body please help me in getting resolved this issue.

    --Satish
  2. Dimiter Madjarov
    Admin
    Dimiter Madjarov avatar
    2311 posts

    Posted 09 May 2014 Link to this post

    Hi Joseph,


    This cannot be achieved through the Grid configuration, but could be manually implemented. For example you could bind to the edit event, which is fired when a cell is entering edit mode.
    .Events(e => e.Edit("onEdit"))

    access the current model in the event handler to check the condition and close the cell if it should not be edited.
    function onEdit(e) {
        var dataItem = e.model;
     
        if (<condition>) {
            this.closeCell();
        }
    }

    I hope this information helps.

    Regards,
    Dimiter Madjarov
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  3. Joseph
    Joseph avatar
    11 posts
    Member since:
    Mar 2014

    Posted 15 May 2014 in reply to Dimiter Madjarov Link to this post

    Hi,

    Thanks for the response. But in my case based on Radio button Selection I need to Hide the Row.

    Please find the more details below.

    Details:

    My View is Having two radio Buttons.

    1. Enter in Units.

    2. Enter in $.



    My Grid Contains the following details:

    Row with the Type.

    Row with the Quantity Details

    Row with the Unit Price Details.



    One Scenario:

    If Type value is Sales then I need to hide the Quantity Row.
    If Type values is other than Sales Then I need to Show the Quantity Row.


    Second Scenario:
    If user Selects Enter in Units then I need to Set the Editable mode of the Quantity Cell.
    If user Selects Enter in $ then i need to Set the Editable mode of the Unit Price Cell.

    This is my actual Requirement. So, Can you please guide me on this.

    Regards,
    Satish.N
  4. Dimiter Madjarov
    Admin
    Dimiter Madjarov avatar
    2311 posts

    Posted 16 May 2014 Link to this post

    Hello Joseph,


    Thank you for providing the additional details. Nevertheless I am not sure how they relate to the initial question. Could you please elaborate further?

    Additionally the Grid (and more specifically it's dataSource) does not support different types of data for the different rows. It supports CRUD operations for homogeneous items with the same fields. Are you referring to the Grid columns instead?

    Let me know if you experience any specific Kendo UI related problems during the project implementation, so I could provide further assistance.

    Regards,
    Dimiter Madjarov
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  5. Joseph
    Joseph avatar
    11 posts
    Member since:
    Mar 2014

    Posted 19 May 2014 in reply to Dimiter Madjarov Link to this post

    Hi,

    Thanks for the response.

    I would like to hide the Quantity Row Based on the Forecast Type.

    Quantity, Unit Price, Amount, and Forecast Type are the values in the Forecast Type Column. If Column Cell value is Sales then I need to hide the Row which cell value is Quantity. If Forecast Type cell value is Other than Sales then i need to show the Row which cell value is Quantity.

    Suppose if user selects Enter in Units Radio then I need to set the Edit mode of the Quantity, Unit Price, and Amount contain Cells.

    Suppose if user selects Enter in $ then I need to set the editable mode of the Unit Price value Cell.

    Please let me know if you need any more information.

    Regards,
    Satish.N



  6. Dimiter Madjarov
    Admin
    Dimiter Madjarov avatar
    2311 posts

    Posted 19 May 2014 Link to this post

    Hi Joseph,


    You could use the removeRow method of the Grid API in order to remove a row or jQuery hide method to hide it, based on the exact requirements in the current scenario.

    As for the second question, as stated previously, setting the editable mode of a cell is not supported. You should use the approach from my first answer and close the cell if the condition is satisfied.

    Regards,
    Dimiter Madjarov
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  7. Hanh
    Hanh avatar
    5 posts
    Member since:
    May 2019

    Posted 02 Oct 2019 in reply to Dimiter Madjarov Link to this post

    Hi!
    I have the same issue like this post that i need to set editable mode for particular cell under conditions, I've try function onEdit() like you said above  but this function disable not only edit mode of this cell but also every cells of that cell's row. Can you please support me with this? 
  8. Tsvetomir
    Admin
    Tsvetomir avatar
    757 posts

    Posted 04 Oct 2019 Link to this post

    Hi Hanh, 

    The suggestion that is provided in the previous correspondence in this thread is rather outdated. If you would like to conditionally enable a certain cell for editing or not, I can recommend using the Editable option. Here is an example:

    columns.Bound(x => x.LastName).Editable("isEditable");
     
    function isEditable(e) {
         if(condition){
             return true;
         } else {
             return false;
         }
    }

    Give this a try and let me know how it works out for you.

     

    Best regards,
    Tsvetomir
    Progress Telerik

    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top