How might I setup Kendo UI in Visual Studio 2010? [closed] - visual-studio-2010

It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center.
Closed 10 years ago.
How might I setup Kendo UI in Visual Studio 2010?

Check this sample application like Kendo UI and ASP.NET WebForms : Building a Task Manager and here is the steps to start working with this.
- In Visual Studio, create a new ASP.NET Web application.
- Download Kendo UI.
- From the Kendo UI download, I copied the following files into the TaskManager/Scripts folder:
1.js/jquery.min.is
2.js/keno.all.min.js
- In the TaskManager application I created a new folder called "kendo" in the /Content folder.
- From the Kendo UI download, copy the following files / folders into the /Content:
1.styles/kendo.common.min.css
2.styles/kendo.silver.min.css
3.styles/Silver (folder)
Inclue these in head section:
<head>
<title></title>
<link href="Content/kendo/kendo.common.min.css" rel="Stylesheet" type="text/css" />
<link href="Content/kendo/kendo.silver.min.css" rel="Stylesheet" type="text/css" />
<link href="Content/Site.css" rel="Stylesheet" type="text/css" />
<script src="Scripts/jquery.min.js" type="text/javascript"></script>
<script src="Scripts/kendo.all.min.js" type="text/javascript"></script>
<script src="Scripts/json.extensions.js" type="text/javascript"></script>
</head>
go for the Codeplex - Kendo UI ASP.NET Sample Applications for the samples and usage of Kendo.

Simple All you Need is this
Getting Set Up
To get started create a new ASP.Net Empty Web Application.
Note: You can really use any web based project template you like, in this walkthrough I just chose to start with nothing. :)
Once the project loads, fire up the NuGet Package Manager Console.
Here :NuGet NuGet is a Visual Studio extension that makes it easy to install and update third-party libraries and tools in Visual Studio.(Like J query and Kendoui Files)
Add JQuery to the project using the command:
Install-Package jQuery
Add KendoUI to the project using the command:
Install-Package KendoUIWeb
Once you run both of these NuGet commands, the solution explorer should look like this:
Source :Check it out

Related

Kendo UI Grid - Where to look for fonts and icons

I'm in the early stages of learning Kendo UI. I've got the grid work and loading data but none of the images/icons that should appear in the grid are appearing. When I load the page containing the grid, I get the following 404 errors. The error message doesn't tell me where it's expecting to find these files.
Where is Kendo UI looking for these files? Or, can I tell Kendo where to look for them?
I currently have the files located here in my MVC folder structure, but it's not finding them:
The fonts and icons should be located under the content\kendo\{your kendo version}\ (assuming you are creating an MVC.net site based on the tag (see image below)
if this is missing then try running the upgrade wizard in visual studio (assuming you are using visual studio here) or just include the files you require from your distribution.
can you also check you have included the required css links within your site (please note I am using the bootstrap theme here so alter to work with your theme as required):
<link href="#Url.Content("~/Content/kendo/2017.1.118/kendo.common-bootstrap.min.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/Content/kendo/2017.1.118/kendo.mobile.all.min.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/Content/kendo/2017.1.118/kendo.dataviz.min.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/Content/kendo/2017.1.118/kendo.bootstrap.min.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/Content/kendo/2017.1.118/kendo.dataviz.bootstrap.min.css")" rel="stylesheet" type="text/css" />
if this is set up correctly just make sure the fonts etc are set to "content" for the 'Build Action'
Check to make sure that the version in your direction matches the version of the kendo.mvc.dll in your bin folder. It has to match your assembly version.
I found this out when I upgraded. Somehow my project was not pointing to the correct assembly.

How to add Semantic-UI LESS to Codeigniter 3.x

I want to know how to use Semantic-UI to codeigniter 3.x as frontend framework.
I want to use LESS and not css. thanks
First, it is important to understand that LESS is a CSS pre-compiler that extends the CSS language with features that allows creation of CSS that is more maintainable, themeable and extendable. But ultimately it creates CSS files that are used exactly the same as any other CSS file in a website.
In CodeIgniter you use Semantic-UI created assets the same way as any other CSS (or javascript) files by using a <link> tag.
<link rel="stylesheet" type="text/css" href="semantic/dist/semantic.min.css">
<script src="semantic/dist/semantic.min.js"></script>
The CSS classes are used in "view" files exactly the same way any other CSS defined class. For instance, the following would put a button styled by Semantic-UI into a CodeIgniter "view" file.
<button class="ui button">Follow</button>
So, the short answer to your question is that you use Semantic-UI in CodeIgniter the same way any other frontend framework that produces CSS and Javascript.
How to use the tools required to customize Semantic-UI is way beyond the scope of what is a "good" question on Stackoverflow.
If you want to customize and build your own version of the UI, you have a steep learning curve ahead. You can start your learning on Semantic-UI's Getting Started page and on the Learn Semantic website.
I have done Semantic UI integration on my CodeIgniter based application starter: https://github.com/ivantcholakov/starter-public-edition-4
For compilation of your own visual themes you need to install locally on your development machine node.js, less.js, postcss/cssnano, they should be able to start from command line.
See the configuration file platform/common/config/less_compile.php there you can define by example your own visual theme. Also, have a look at the already created themes, you will see how to add your common Semantic UI customizations and your theme-specific styles.
add css link in your header and js in your footer
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.3.3/semantic.min.css">
<script type="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.3.3/semantic.min.js"></script>

Javascript references aren't working ASP.NET Development Server?

I'm not sure what's going on here. I've reformed the links in every way I can think of to try and reference my Script libraries, but nothing seems to work.
When I upload it to my web host it works fine, locally it doesn't work at all.
The weirdest part is, it references my CSS files fine and nothing else seems to have any issues.
//Works
<link href="#Url.Content("~/Content/main.css")" rel="stylesheet" type="text/css" />
//Doesn't work
<script src="#Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
I'm not sure what could be going on here or really even where to debug from here. I've tried removing the #Url.Content(...) and pointing directly to the directory, but that doesn't do anything at all. Hopefully someone else has run into this issue and has figured out a solution.
Using: ASP.NET MVC3 Razor, Visual Studio 2010 Professional
If you're using the default directory setup then your Scripts folder is a sub-directory of the Content folder; in which case:
<script src="#Url.Content("~/Content/Scripts/jquery-1.5.1.min.js")"></script>

YUI on Windows 8 Metro App: YUI is not recognized

I am trying to create a Hello World JS Metro app on Visual Studio 2011, using YUI3.
I´ve grabbed a local copy of YUI, added to a subfolder in the solution, and added a reference to yui-min.js on my default.html page:
<!-- TodoJS references -->
<link href="/css/default.css" rel="stylesheet">
<script src="/js/default.js"></script>
<script src="js/yui/build/yui/yui.js"></script>
and then at the bottom of the page I´ve added the following code:
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function () {
YUI().use("event", function () {
//some code will go here..
});
}, false);
</script>
When I run the code, I get a null ref error on YUI(). I do get intelissense working in Visual Studio (e.g YUI().add), so the reference seems to be OK, but YUI is not found on run time. Any tips?
I would try the steps outlined in How To: Create a Windows 8 Metro App with JS and YUI 3
I take it that you've got the issue fixed. However if you'd like to use the YUI components such as "calendar", "tabview" etc, you'll have to modify a few files that include innerHTML calls and wrap the added html content with toStaticHTML.
There were only a couple of files(dom-base.js, yui.js) that needed to be modified and most of the components worked fine(including the "datatable" and "charts" widgets), with the exception of the rich text editor. The nice thing about YUI is that it supports touch gestures for a majority of the components, for example panning "datatable" works correctly.

Sencha Touch 2 Standard Themes?

I noticed that the theme code is missing from the KitchenSink in the final version of ST2. Are there any default themes that ship with the product? Also, are there any open source themes available? I'd like to have a few themes handy for demos so I can easily switch between them.
Yes there are, if you open up senchatouch2/resources/css you've got the default sencha-touch.css and then you have apple.css, android.css, bb6.css(blackberry).
<link rel="stylesheet" href="senchatouch2/resources/css/apple.css" type="text/css" />
I think following url will help someone
http://developerextensions.com/index.php/sencha-touch-2-themes-builder
---Add the following link to your sencha-touch-2 app's html file.
---DEShowThemeBuilder(true); //function to show the theme builder
---DEShowThemeBuilder(false); //function to hide the theme builder
<script type="text/javascript" src="http://developerextensions.com/components/com_extensiondemo/views/extensiondemo/tmpl/sencha2/ux/themeBuilder/themeBuilder.js"></script>

Resources