Checkbox Styling with DataSource

9 posts, 0 answers
  1. Rider333
    Rider333 avatar
    9 posts
    Member since:
    Sep 2009

    Posted 24 Oct 2016 Link to this post

    I have a treeview set up as below ("treeview"), and the rendered checkboxes are not styled according to the theme (bootstrap).  If I set up another treeview with local data ("treeview1"), they render as themed.  Any hints as to how i can get the checkboxes to adhere to the theme when using a datasource?

     

    NOT THEMED:

    @(Html.Kendo().TreeView()
            .Name("treeview")
            .Checkboxes(checkboxes => checkboxes.Name("checkedCategories")
            .CheckChildren(true))
            .Events(events => events.Check("onCheck"))
            .DataTextField("description")
            .DataSource(dataSource => dataSource
                .Model(m => m.HasChildren("HasChildren").Children("Children"))
                .Read(read => read.Action("GetFilters", "ProductList")))
              )

    THEMED:

    @(Html.Kendo().TreeView()
            .Name("treeview1")
            .Checkboxes(checkboxes => checkboxes.Name("checkedCategories"))
            .Items(treeview =>
           {
               treeview.Add().Text("Asset Class").Id("1-1")
                   .Expanded(true)
                   .Items(category =>
                   {
                       category.Add().Text("My first thing").Id("2-1");
                       category.Add().Text("My Second Thing").Id("2-2");
                   });
           }))

  2. Magdalena
    Admin
    Magdalena avatar
    442 posts

    Posted 26 Oct 2016 Link to this post

    Hi,

    We have created a sample project, but we are not able to reproduce the issue. Check-boxes in the both cases look in the same way. We are sending you this video as a part of the testing for your reference. Could you please watch the video and tell us if there is something important missing in our sample?

    Regards,
    Magdalena
    Telerik by Progress
    Check out the new UI for ASP.NET Core, the most complete UI suite for ASP.NET Core development on the market, with 60+ tried-and-tested widgets, based on Kendo UI.
  3. Rider333
    Rider333 avatar
    9 posts
    Member since:
    Sep 2009

    Posted 26 Oct 2016 Link to this post

    Hi, thanks for the reply.  I have attached a picture of what I'm seeing.  The first group is bound to the remote data, and the second is bound to the local data.  Notice that the local data checkboxes seem to be themed and look different...this is what I want, but I'm not sure how this is being done to these, but not the remote ones.  Let me know what you think.

    Here is my bundling, followed by the rendering from _Layout.cshtml (this is an MVC5 app):

    public static void RegisterBundles(BundleCollection bundles)
            {
                bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                            "~/Scripts/jquery-{version}.js"));

                bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                            "~/Scripts/jquery.validate*"));

                // Use the development version of Modernizr to develop with and learn from. Then, when you're
                // ready for production, use the build tool at http://modernizr.com to pick only the tests you need.
                bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                            "~/Scripts/modernizr-*"));

                bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
                          "~/Scripts/bootstrap.js",
                          "~/Scripts/respond.js"));

                bundles.Add(new StyleBundle("~/Content/css").Include(
                          "~/Content/bootstrap.css",
                          "~/Content/site.css"));

                bundles.Add(new ScriptBundle("~/bundles/kendo").Include(
                   "~/Scripts/kendo/kendo.all.min.js",
                   "~/Scripts/kendo/kendo.aspnetmvc.min.js"));

                bundles.Add(new StyleBundle("~/Content/kendo/css").Include(
                    "~/Content/kendo/kendo.common-bootstrap.min.css",
                    "~/Content/kendo.bootstrap-theme.min.css",
                    "~/Content/kendo/kendo.bootstrap.min.css"));

                bundles.IgnoreList.Clear();
            }

     

    ----------------------------

     

    Layout:

    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>@ViewBag.Title - My ASP.NET Application</title>
        
        @Styles.Render("~/Content/css")
        @Styles.Render("~/Content/kendo/css")
        @Scripts.Render("~/bundles/jquery") 
        @Scripts.Render("~/bundles/bootstrap")
        @Scripts.Render("~/bundles/modernizr")
        @Scripts.Render("~/bundles/kendo")

     

    etc...

  4. Magdalena
    Admin
    Magdalena avatar
    442 posts

    Posted 28 Oct 2016 Link to this post

    Hi,

    We have succeeded to reproduce the issue. We have forward the issue for further investigation to the responsible developer team and we will contact you as soon as we have an answer.

    Regards,
    Magdalena
    Telerik by Progress
    Check out the new UI for ASP.NET Core, the most complete UI suite for ASP.NET Core development on the market, with 60+ tried-and-tested widgets, based on Kendo UI.
  5. Rider333
    Rider333 avatar
    9 posts
    Member since:
    Sep 2009

    Posted 28 Oct 2016 in reply to Magdalena Link to this post

    Perfect, thanks!
  6. Magdalena
    Admin
    Magdalena avatar
    442 posts

    Posted 01 Nov 2016 Link to this post

    Hi,

    Actually this is an issue, and we have logged it for fixing. We have added you Telerik points for reporting a bug. We would like to appologize for any inconvenience caused.

    Regards,
    Magdalena
    Telerik by Progress
    Check out the new UI for ASP.NET Core, the most complete UI suite for ASP.NET Core development on the market, with 60+ tried-and-tested widgets, based on Kendo UI.
  7. Rider333
    Rider333 avatar
    9 posts
    Member since:
    Sep 2009

    Posted 01 Nov 2016 in reply to Magdalena Link to this post

    OK, thanks.
  8. Cédric
    Cédric avatar
    2 posts
    Member since:
    Jun 2012

    Posted 14 Dec 2016 Link to this post

    Hello,

    We get the same problem with checkbox styling and datasource, is there a workaround ?

    In which release this bug will be fix ?

    Thanks

  9. Ivan Zhekov
    Admin
    Ivan Zhekov avatar
    571 posts

    Posted 16 Dec 2016 Link to this post

    The public GitHub issue for this bug is https://github.com/telerik/kendo-ui-core/issues/2379.

    As of now there is no workaround nor a quick solution.

    Regards,
    Ivan Zhekov
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top