jQWidgets Forums

Tagged: Angular

This topic contains 3 replies, has 3 voices, and was last updated by Peter Stoev 9 years, 1 month ago.

Viewing 4 posts - 1 through 4 (of 4 total)

Author

Angular ui-router Issue – jQWidgets ver 4.0 Posts

March 2, 2016 at 6:48 am Angular ui-router Issue – jQWidgets ver 4.0 #82006

Keshavan

Participant

Hi,

jQWidgets Ver 4.0.
Issue with Angular ui-router. does Ver 4.0 support ui-router ?.

Please help.

Thanks,
Keshavan

Below is my code.

app.js
——

< script type = "text/javascript" >
    var demoApp1 = angular.module('dempApp1', ['ui.router'])
demoApp1.(['$stateProvider', '$urlRouterProvider',
    function ($stateProvider, $urlRouterProvider) {
                // $urlRouterProvider.otherwise('Quotations');
                $stateProvider
                // HOME STATES AND NESTED VIEWS ========================================
                    .$state('Quotations', {
                        url: '/AngularJS/jQWidgets/',
                                template: '/AngularJS/jQWidgets/body.html'
                    })
                    // ABOUT PAGE AND MULTIPLE NAMED VIEWS =================================
                    .$state('Messages', {
                        url: '/AngularJS/jQWidgets',
                        templateUrl: 'body.html'
                    });
}); < /script>

index.html
----------
<!DOCTYPE html>
<html ng-app="demoApp" lang="en">
<head>
    <title id='Description'>The demo demonstrates the Minimized state of jqxMenu.</title>
    <link rel="stylesheet" type="text/css" href="/angularjs/jQWidgets/jqwidgets/styles/jqx.base.css" />
    <script type="text/javascript" src="/angularjs/jQWidgets/scripts/jquery-1.11.1.min.js"></script>
    <script type="text/javascript" src="/angularjs/jQWidgets/angular.js"></script>
    <script type="text/javascript" src="/angularjs/jQWidgets/jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="/angularjs/jQWidgets/jqwidgets/jqxmenu.js"></script>
    <script type="text/javascript" src="/angularjs/jQWidgets/jqwidgets/jqxangular.js"></script>
    <script type="text/javascript" src="/angularjs/jQWidgets/jqwidgets/jqxcheckbox.js"></script>
    <script type="text/javascript" src="/angularjs/jQWidgets/scripts/demos.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.18/angular-ui-             router.js"></script>
    <script type="text/javascript" src="/angularjs/jQWidgets/scripts/app.js"></script>
    <script src="https://cdn.firebase.com/js/client/2.2.4/firebase.js"></script>
    <script type="text/javascript" src="/angularjs/jQWidgets/jqwidgets/globalization/globalize.js"></script>
    <script src="https://cdn.firebase.com/libs/angularfire/1.1.3/angularfire.min.js"></script>
    <script type="text/javascript">
        var demoApp = angular.module("demoApp", ['jqwidgets']);

        demoApp.controller("demoController", function ($scope) {
            $scope.checked = true;
            var menu = {};
            $scope.menuSettings = {
                width: '100%',
                height: '32px',
                created: function (args) {
                    menu = args.instance;
                    menu.minimize();
                }
            };
            $scope.changeState = function () {
                if ($scope.checked) {
                    menu.minimize();
                } else {
                    menu.restore();
                }
            }
        });
    </script>
    </head>
<body ng-controller="demoController">
    <jqx-menu jqx-settings="menuSettings">
        <ul>
            <li><a sref="Quotations">Quotations</a></li>
            <li><a sref="Messages">Messages</a></li>
            <li><a sref="Logout">Logout</a></li>
        </ul>
    </jqx-menu>
    <jqx-check-box ng-model="checked" ng-change="changeState($event)">Minimized</jqx-check-box>
    <br/>
     <section ui-view></section> </body>
</html>

body.html
---------

<h1>My Contacts</h1>

March 2, 2016 at 7:05 am Angular ui-router Issue – jQWidgets ver 4.0 #82008

Peter Stoev

Keymaster

Hi Keshavan,

“. does Ver 4.0 support ui-router ?.” – Yes, it supports. The previous version supports it, too.

We have example which is online and which works: http://www.jqwidgets.com/jquery-widgets-demo/demos/angularjs-demos/dropdownlist-angular-ui-router.htm?arctic#/route1. I suggest you to check it out and apply the same logic on your side. jQWidgets ver.4.0.0 supports UI Router.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

April 7, 2016 at 10:53 pm Angular ui-router Issue – jQWidgets ver 4.0 #83271

billmccall

Participant

Hi Peter, how do we find the source to examples like you provided on angular ui router? I like to see this I’m having issues with the <ng-view> use and routing with jqxsplitter. Any other examples of angular using angular-route and <ng-view> would be great. Thanks

April 8, 2016 at 6:46 am Angular ui-router Issue – jQWidgets ver 4.0 #83281

Peter Stoev

Keymaster

You can click view source of any demo on our website or download jQWidgets. All demos are included in the download package.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

Author

Posts

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.