Style broken in edit mode

6 posts, 1 answers
  1. David
    David avatar
    15 posts
    Member since:
    Mar 2019

    Posted 02 May 2019 Link to this post

    Hello,

    I am using an aspnetcore Grid and I noticed that the style of the edit form is different from the rest of the site.

    For information, my site is setup to use the telerik bootstrap 4 style with custom colors (used the Telerik Theme Builder)

     

    The problem I experience seems related to the classes used in my site versus the demo. In the demo (https://demos.telerik.com/aspnet-core/grid/editing-popup), the control classes all use a k- prefix. "k-textbox" "k-input" "k-numerictextbox". On my site, the classes are text-box single-line only. When I manually change them to k-textbox for example, the css applies and is displayed properly.

    Did I configure something improperly for the classes used to be different from the demo?

    Any help would be appreciated!

     

  2.
  3. Answer
    Konstantin Dikov
    Admin
    Konstantin Dikov avatar
    2466 posts

    Posted 07 May 2019 Link to this post

    Hello David,

    If you are using custom PopUp edit template you could use Kendo editors (like NumericTextBox, TextBox, DropDownList, etc.) in the template. If you are using the auto-generated template, please ensure that you have the Kendo editors in the "Views/Shared/EditorTemplates" folder for each data type that you are using.

    For example, here is the "Date.cshtml" template that we provide with the installation of the suite:
    @model DateTime?
     
    @(Html.Kendo().DatePickerFor(m => m))

    And here is the "Number.cshtml":
    @model double?
     
    @(Html.Kendo().NumericTextBoxFor(m => m)
          .HtmlAttributes(new { style = "width:100%" })
    )

    Note that you will have to set the "DataType" attribute in the model for each property:
    [DataType(DataType.Date)] //This will force the Grid to use the Date.cshtml editor
    public DateTime LastSupply
    {
        get;
        set;
    }

    Hope this helps.


    Regards,
    Konstantin Dikov
    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.
  5. David
    David avatar
    15 posts
    Member since:
    Mar 2019

    Posted 15 Aug 2019 in reply to Konstantin Dikov Link to this post

    Wow I didn't know about editor templates!

    That was indeed what was missing. I hadn't created a fresh telerik aspnetcore project from scratch but rather upgraded an existing project and I guess I had missed that part. Thank you for this! Works properly now!

    David

  7. Petter
    Petter avatar
    4 posts
    Member since:
    Dec 2019

    Posted 26 Oct 2020 Link to this post

    The editor for the jQuery version of the grid does not have this issue. In my opinion, the proposed solution with editor template seems to be wrong. I expect the grid to know what classes to put on its most basic input types. In this case put the k-textbox class on the inputs for text, and whatever is missing for numeric inputs (possibly even more types). Do you actually want us to add our own editor just to override incorrect behavior on lots of columns in many grids and several products?
  8.
  9. Eric R | Senior Technical Support Engineer
    Admin
    Eric R | Senior Technical Support Engineer avatar
    457 posts

    Posted 28 Oct 2020 Link to this post

    Hi Petter,

    For the autogenerated template, our Project Templates include the pre-built editors out-of-the-box. If they were removed, these can be found at the default installation which is noted below. 

    C:\Program Files (x86)\Progress\Telerik UI for ASP.NET Core [VERSION]\wrappers\aspnetcore\EditorTemplates\razor

    Alternatively, if the goal is to use a custom editor, it is correct that this will require adding a custom editor. For a full example of this, see the Creating Custom Editors for Bound Properties documentation.

    Ultimately, the ASP.NET Core HTML and Tag Helpers are wrappers around the jQuery Widgets and the same functionality is available. However, it shouldn't be required to create a custom editor as described. 

    Although, I may be missing something. Can you let me know if you experiencing a different issue in this scenario?

    In the meantime, please let me know if you need any additional information. Thank you and I look forward to your reply.

    Regards,


    Eric R | Senior Technical Support Engineer
    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/.

  11. Petter
    Petter avatar
    4 posts
    Member since:
    Dec 2019

    Posted 29 Oct 2020 in reply to Eric R | Senior Technical Support Engineer Link to this post

    Thanks! This was very helpful. The project templates was not removed but never included. We started making projects first and then included Telerik components later.
Back to Top