This is a migrated thread and some comments may be shown as answers.

Where are k-add-button and related CSS styles defined?

3 Answers 267 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Steve
Top achievements
Rank 1
Steve asked on 25 Sep 2013, 03:41 AM
I have been using the example KendoUI MVC4 samples with generally good success. However, some of the CSS styles such as k-add-button, k-edit-button and k-update-button show up as 'Unknown CSS class ...' in Visual Studio editor in my Razor view files. I could not find where these styles are defined, either in my project or in the KendoUI distribution. Since I am having a problem with the ListView MVC 4 example (the 'Add new record' button does not work), I suspect it may be related to the undefined k-add-button style. My _Layout.cshtml file contains the following references:
<link href="@Url.Content("~/Content/kendo/2013.2.716/kendo.common.min.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/kendo/2013.2.716/kendo.dataviz.min.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/kendo/2013.2.716/kendo.default.min.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/kendo/2013.2.716/kendo.dataviz.default.min.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/kendo/2013.2.716/jquery.min.js")"></script>
<script src="@Url.Content("~/Scripts/kendo/2013.2.716/kendo.all.min.js")"></script>
<script src="@Url.Content("~/Scripts/kendo/2013.2.716/kendo.aspnetmvc.min.js")"></script>

3 Answers, 1 is accepted

Sort by
0
Accepted
Ryan Lewis
Top achievements
Rank 1
answered on 25 Sep 2013, 09:42 PM
Hi Steve,
Those styles are used by Javascript to bind click events, not for CSS styling. Look at this example to see more info:
http://demos.kendoui.com/web/listview/editing.html

Somewhere in your script tags you should have code similar to this:
$(function() {
        var listView = $("#listView").data("kendoListView");
 
        $(".k-add-button").click(function(e) {
            listView.add();
            e.preventDefault();
        });
    });
Good luck!
Ryan
0
Dimo
Telerik team
answered on 26 Sep 2013, 08:46 AM
Hello,

Ryan is right - some Kendo UI CSS classes are not used for styling.

Here is a working ListView add/edit demo:

http://demos.kendoui.com/web/listview/editing.html

 

Regards,
Dimo
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Steve
Top achievements
Rank 1
answered on 27 Sep 2013, 01:29 AM
Thanks, guys for clearing this up. The script was just what I needed to get it working.
Tags
General Discussions
Asked by
Steve
Top achievements
Rank 1
Answers by
Ryan Lewis
Top achievements
Rank 1
Dimo
Telerik team
Steve
Top achievements
Rank 1
Share this question
or