Dear all,
I am brand new to Kendo UI SPA anf wanted to create my 1st 'Hello World' application.
To get organized JS files I also wanted to use requireJS, but I could not really get what I want and I need your help (please).
This is my index.html:
This is my main.js:
This is my myapp.js:
This is what I have so far, and it shows up 'App started' in the browser's console log.
But what I could not get is:
1. Create a view which is a requireJS model
2. This view should load the template from a file using the requireJS text plugin
3. The view should show up inside the DOM's #app DIV.
4. Later on I want to create several views using requreJS module and switch between them
So this is really basic. But I don't know how to combine SPA and requireJS.
I need your help,
Thanks a lot!
I am brand new to Kendo UI SPA anf wanted to create my 1st 'Hello World' application.
To get organized JS files I also wanted to use requireJS, but I could not really get what I want and I need your help (please).
This is my index.html:
<!DOCTYPE html><html> <head> <title>TestApp</title> <meta charset="utf-8"/> <link href="js/libs/kendo/styles/kendo.common.min.css" rel="stylesheet"/> <link href="css/main.css" rel="stylesheet"/> <script data-main="js/main" src="js/libs/require.js"></script> </head> <body> <noscript> <h3>Javascript muss aktiviert werden!</h3> <h3>Javascript must be active!</h3> </noscript> <h3>TestApp</h3> <div id="app"></div> </body></html>This is my main.js:
require.config({ paths: { jquery : "libs/kendo/js/jquery.min", kendo : "libs/kendo/js/kendo.all.min", text : "libs/text", indexViewModel : "models/m_index", indexViewTemplate : "views/v_index.html" }, // inform requirejs that kendo ui depends on jquery shim: { "kendo": { deps: ["jquery"] } }}); require(['jquery', 'kendo', 'myapp'], function() { var $ = require('jquery'); var kendo = require('kendo'); var myapp = require('myapp'); var App = new myapp(); App.init();});This is my myapp.js:
define(function(){ var myApp = function() { var constructor, app = {}, // public class object of app constructor = function() { console.info('App constructor executed'); return app; }; app.init = function() { console.info('App started'); // Here I want to enter the code which should create the view and load the template as text
// The view model should be a requureJS file and the template for the view should be loaded by
// require text plugin }; return constructor.apply(null, arguments); }; return myApp;});This is what I have so far, and it shows up 'App started' in the browser's console log.
But what I could not get is:
1. Create a view which is a requireJS model
2. This view should load the template from a file using the requireJS text plugin
3. The view should show up inside the DOM's #app DIV.
4. Later on I want to create several views using requreJS module and switch between them
So this is really basic. But I don't know how to combine SPA and requireJS.
I need your help,
Thanks a lot!
2 Answers, 1 is accepted
0
Accepted
Hello Timon,
I prepared an example which should match your requirements - please examine it.
Regards,
Petyo
Telerik
I prepared an example which should match your requirements - please examine it.
Regards,
Petyo
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
T.
Top achievements
Rank 1
Rank 1
answered on 18 Aug 2014, 12:55 PM
Hi Petyo,
thanks that helped!
thanks that helped!