custom column length in edit mode

15 posts, 1 answers
  1. Daniel
    Daniel avatar
    192 posts
    Member since:
    Mar 2012

    Posted 26 Feb 2013 Link to this post

    In your examples,i noticed that the column has a big width,but when editing the column,the texbox is much smaller,so it doesn't rich the end of column limits.how can i do that?

    Regards,
    Daniel

  2. Dimiter Madjarov
    Admin
    Dimiter Madjarov avatar
    2310 posts

    Posted 27 Feb 2013 Link to this post

    Hello Daniel,

    to specify that the width of the input fields should fill the whole width of the column, you could set the following CSS styles:

    E.g.
    <style>
      /*Batch Edit Mode*/
      .k-edit-cell input
      {
          width: 100%;
      }
     
      /*InLine Edit Mode*/
      .k-grid-edit-row input
      {
          width: 100%;
      }
    </style>

     

    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!
  3. Daniel
    Daniel avatar
    192 posts
    Member since:
    Mar 2012

    Posted 28 Feb 2013 Link to this post

    .k-edit-cell and  .k-grid-edit-row are internal classes that use the kendogrid for styling?
  4. Dimiter Madjarov
    Admin
    Dimiter Madjarov avatar
    2310 posts

    Posted 28 Feb 2013 Link to this post

    Hi Daniel,

    .k-edit-cell and  .k-grid-edit-row are Kendo classes, which are set when the Grid enters edit mode. They are used for Batch and for InLine edit mode respectively.

     

    Greetings,
    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. Daniel
    Daniel avatar
    192 posts
    Member since:
    Mar 2012

    Posted 01 Mar 2013 Link to this post

    this apply to all controls,or only to textboxes?for example to change the width of a texbox and the dropdown from this example,how can i do it?
    Regards
  6. Answer
    Iliana Nikolova
    Admin
    Iliana Nikolova avatar
    2622 posts

    Posted 05 Mar 2013 Link to this post

    Hello Daniel,

    By design Kendo UI widgets use primitives (i.e. different HTML elements in different widgets use the same CSS classes to provide a level of abstraction and allow common styling). Hence .k-edit-cell / .k-edit-row classes will be applied to each cell / row in Kendo UI Grid when such is in edit mode. 

    Regarding your other question, to change the width of a texbox when editing a cell you can use the CSS snippet suggested by Dimiter. In order to change the DropDownList editor's width you should change the CSS selector (you can get the right selector as inspect the HTML output with any browser inspector). For example: 
    <style>
    .k-edit-cell .k-widget.k-dropdown{
        width: //....;
    }
    </style>

    Regards,
    Iliana Nikolova
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  7. Rajesh
    Rajesh avatar
    4 posts
    Member since:
    Aug 2011

    Posted 18 Aug 2014 in reply to Iliana Nikolova Link to this post

    Hi

    The following code did not work for me.
    <style>
      /*Batch Edit Mode*/
      .k-edit-cell input
      {
          width: 100%;
      }
     
      /*InLine Edit Mode*/
      .k-grid-edit-row input
      {
          width: 100%;
      }
    </style>

    What would I be doing wrong?

    Thanks


  8. Iliana Nikolova
    Admin
    Iliana Nikolova avatar
    2622 posts

    Posted 19 Aug 2014 Link to this post

    Hi Rajesh,

    I am not quite sure what causes the issue in your application. In order to assist you best and provide concrete recommendations I would like to ask you to provide an isolated runnable example which demonstrates your current implementation and which I can test on my side.

    Regards,
    Iliana Nikolova
    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.

     
  9. Rajesh
    Rajesh avatar
    4 posts
    Member since:
    Aug 2011

    Posted 21 Aug 2014 in reply to Iliana Nikolova Link to this post

    Hello
    I could not attach a project because the sample project size is more than 2 MB.
    But I replied to the email which gets sent via this post and that has the attachment.

    Environment
    IE 11
    VS 2013
    Kendo UI Grid for ASP.NET MVC (kendoui.web.2012.3.1114.commercial)  

    Thank you for the support
    Rajesh

  10. Dimiter Madjarov
    Admin
    Dimiter Madjarov avatar
    2310 posts

    Posted 25 Aug 2014 Link to this post

    Hi Rajesh,


    Please send us the project here or open a ticket for the problem (the file size limit is 20 MB there).

    I am looking forward to hearing from you.

    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.

     
  11. Rajesh
    Rajesh avatar
    4 posts
    Member since:
    Aug 2011

    Posted 25 Aug 2014 in reply to Rajesh Link to this post

    I tried attaching my project file, which is less than 5 MB. But it did not let me attach it and gave me the following error message.
    "The selected file(s) cannot be attached because it may exceed the maximum attachment size (2 MB) or is from not allowed type (allowed: .jpg, .jpeg, .gif, .png, .zip).

    I have attached the error message also in this reply.
  12. Dimiter Madjarov
    Admin
    Dimiter Madjarov avatar
    2310 posts

    Posted 26 Aug 2014 Link to this post

    Hello Rajesh,


    Thank you for the cooperation. Indeed the file limit in our forums is 2 MB. What I was trying to suggest was to open a new support ticket in our ticketing system (not forum), as the limit is bigger there. Thanks for the understanding.

    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.

     
  13. Dimiter Madjarov
    Admin
    Dimiter Madjarov avatar
    2310 posts

    Posted 05 Sep 2014 Link to this post

    Hi Rajesh,


    I reviewed the project and answered the question in the email.

    If you experience any further issues, please send us a ticket in our support system. Thanks for the understanding.

    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.

     
  14. Rajesh
    Rajesh avatar
    4 posts
    Member since:
    Aug 2011

    Posted 05 Sep 2014 in reply to Dimiter Madjarov Link to this post

    Thank you that worked.

    Appreciate your support
  15. Dimiter Madjarov
    Admin
    Dimiter Madjarov avatar
    2310 posts

    Posted 08 Sep 2014 Link to this post

    Hi Rajesh,


    Thanks for the update.
    Have a great day!

    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.

     
Back to Top