Discussion on Xenon - Bootstrap Admin Theme with AngularJS

Discussion on Xenon - Bootstrap Admin Theme with AngularJS

Cart 3,090 sales
Well Documented

Laborator supports this item

Supported

This author's response time can be up to 1 business day.

520 comments found.

You can not select some elements, for example, change the language.

Screen: http://scr.hu/1sj7/u5hqu http://scr.hu/1sj7/ixh53

Hi prezespako

The elements here when you select them, will not behave as standard select dropdown, but once user clicks on them, it will refresh the page and then server side processing will show selected value for that dropdown.


Arlind

the template has a bug when view it on mac os and chrome…i have a screen shot if you want to see.

Art…it is a bug…the menu is not collapsing when you dock the left nav

in addition Art, please contact me at jt49256@gmail.com...I would like to talk to you about a big new project.

Ah now I understand, we will update the theme when we have more free time to work on it and fix some serious issues on the theme.

Regarding your second ticket, we are sorry but we are not taking freelance projects because of we have not so much time to work for other projects outside ThemeForest, also we’re having a problem with our current deadlines.

Kind Regards,
Art

I could not find (Is this an add-on request?) a submenu “Images” inside UI-Elements for both Xenon/Neon. There are some css “img-cirlce” (Misspelled circle?) also “corona”,”shade”,etc that has no reference. It is a great panel and I believe that covering simple img would just add more value to it. And if there are already some CSS ready to use with pics inside text (not galleries), hey! That would be awesome!.

Hi cunha1973

Thanks for your kind words.

Yes you are right, there are these CSS classes for both Xenon and Neon but we haven’t covered them in our theme, because they were just small classes. So basically you can use these classes: img-circle img-rounded img-responsive for image transformations.

I hope this was what you were talking about.


Arlind

Can you guys invite me to the github repo? Github username: luneo7

Hi luneo7

We have invited you to our GitHub repo.

Kind Regards,
Art

sorry for my orrible english. i want to implement datatables. can you help me?

Hi there, can you please post with the account you bought the theme, this way we can verify that you’re a real customer as we do not offer support to users who doesn’t have “Purchased” badge.

Kind Regards,
Art

Hi, I like the menu level of the sidebar and would like to use in within the page itself. Is there a way I can place it in the main content area?

Hi adrielzxdf

I am sorry but the main sidebar menu functionality cannot be moved inside content or any part of the template, it can work only there but if you can code it to work somewhere else then that would be great for you.


Arlind

I am using the multi-select plug-in and it’s all working fine but I’m trying to add a search ability for it. The search is working but only in the invisible ‘select’ portion and not the ‘ms-selectable’ control which is the visible left hand side of the multi-select. Any ideas?

Hi Troy

Thanks for your your kind comments, it is always fun to help you.

After reading on their official plugin page, to make the multi select searchable, you have their own code which is this:

http://pastebin.com/BNXLmc89

Please try this solution and see if it will work.

Yes, you can update Angular core version, it will not break anything, even if so, you can revert back the changes but I think it will work fine.


Arlind

Awesome thanks! Is there a document or correct steps to follow when upgrading the version of Angular? Just need to upgrade the main angular.js file?

Hi Troy

I don’t know exactly, it has been a while since I’ve worked with Angular and don’t know if its the same but I believe that it will not change drastically, because this is a huge project, and if the big changes come then the version 1.0 will be deprecated and it will be published as standalone version for example 2.0 or whatever. So feel free to update it, but save the old files just in case.


Arlind

I love the Xenon theme! I am receiving the following error though in the angular version, and I can’t seem to track it down. Any ideas what is causing it? Occurs in latest version of Chrome on Mac if that matters. Thanks!

Error: [$compile:tplrt] http://errors.angularjs.org/1.2.26/$compile/tplrt?p0=sidebarProfile&p1=app%2Ftemplates%2Flayout%2Fsidebar-profile.html at Error (native) at http://localhost:8080/app/js/angular/angular.min.js:6:450 at http://localhost:8080/app/js/angular/angular.min.js:60:173 at http://localhost:8080/app/js/angular/angular.min.js:72:199 at l.promise.then.F (http://localhost:8080/app/js/angular/angular.min.js:100:187) at l.promise.then.F (http://localhost:8080/app/js/angular/angular.min.js:100:187) at http://localhost:8080/app/js/angular/angular.min.js:101:350 at k.$get.k.$eval (http://localhost:8080/app/js/angular/angular.min.js:112:68) at k.$get.k.$digest (http://localhost:8080/app/js/angular/angular.min.js:109:168) at k.$get.k.$apply (http://localhost:8080/app/js/angular/angular.min.js:112:398)(anonymous function) angular.js:10072$get angular.js:7364l.promise.then.F angular.js:11576l.promise.then.F angular.js:11573(anonymous function) angular.js:11659$get.k.$eval angular.js:12702$get.k.$digest angular.js:12514$get.k.$apply angular.js:12806h angular.js:8379u angular.js:8593z.onreadystatechange @ angular.js:8532

Hi bsohl,

This issue is related to theme developer and I am unable to give you any solution about this because I am not backend developer.

Our theme developer Arlind and Art can help you with this, but they took the vacation and will be back on 18 June.

When they comes back, just reply to this thread and you will make sure Arlind and Art will see your comment.

Hope for your understanding :)

Kind Regards,
—Ylli

OK, I will check back then. Thanks.

Glad to hear that :)

Kind Regards,
—Ylli

Hi, I don’t understand. If I want to use charts, I need to buy a DevExpress? I don’t have any option to use charts that not is DevExpress?

Tks

Hi welcf

To use DevExpress charts in commercial site, you need to purchase separate license for them, otherwise most of users who use xenon and charts didn’t had to purchase the license. Charts will work also if you don’t purchase the license without any problem and watermark.


Arlind

Hi,

Is it possible to just bind a DxChart to a controller – rather than setting it up in Jquery as in the dashboard examples.

I checked the Dx documentation and then added this to the dashboard with chartsettings on the Controller

But it doesn’t work – the other graphs show fine. I wondered if you have an suggestions?

Thanks

Hi

Sure, that is possible, just assign ng-controller and from there call the DxChart instance, that is the same as using jQuery, but I have developed in that way (I know its lazy thing, but I was out of time to release AngularJS version of Xenon and some things remained that way).


Arlind

I would like to include the angularJS theme in the mean.io stack. can you give some guide on how to get this to work? or maybe their is already a build for this? would be fantastic.

Hi grinono

Actually the support for AngularJS of Xenon is only limited to the current functionality shown in the demo site. I haven’t tested it with mean.io I don’t have any information/knowledge how this would work with Xenon! I am sorry about that.


Arlind

Collapsed navigation bug report >>

I entered page and clicked on navigation item with 6 subpages I collapsed navigation That submeni was left open I moved my mouse to other meni items, it was still open and I could not see all subpages on other meni with subpages I clicked again on that item with 6 subpages, it closed it self I clicked again on that same item with 6 subpages, it was not opening, like it never existed I was able to see other meni items with subpages but that one was not showing.

a) How to fix that? b) Why doesn’t it stay collapsed once I collapse it first time and browse through pages?

Best regards :)

Hi Cokaric

Thanks for reporting this issue.

I have figured out a solution and I hope it will work for you. So download this file:

http://drops.laborator.co/1lk5Z

And replace it in:

assets/js/

I hope it will work for you.


Arlind

Hi, I was wondering if there is a busy indicator included in the templates? I’ve looked around but didn’t see one.

Thanks, Troy

Hi Troy

Actually there is no built-in indicator but you can simply improvise it with, for example a button:

// Normal button
<button class="btn btn-primary">
    <i class="fa fa-circle-o-notch fa-spin busy-indicator" />
    Do AJAX
</button>

// When clicking, via javascript make this button disabled
<button class="btn btn-primary" disabled>
    <i class="fa fa-circle-o-notch fa-spin busy-indicator" />
    Do AJAX
</button>

// The proper style to make this work fine
<style>
    .busy-indicator {
        display: none;
    }

    .btn[disabled] .busy-indicator {
        display: block;
    }
</style>


Arlind

Thanks template master! I’ll give it a whirl.

dashvoard-1 does not operate in the browser “Project Spartan” on Windows 10

Hi Choven, we haven’t tested Xenon on Edge, we don’t have windows 10 machine with Microsoft Edge for them moment.

When we will get hands on it we will check what’s wrong.

Kind Regards,
—Ylli

thanks

We are getting following errors while doing css bundling & minification.

Minification failed. Returning unminified contents. (1073,50745): run-time error CSS1055: Expected media-query expression, found 'screen' (1073,50900): run-time error CSS1055: Expected media-query expression, found 'screen' (1073,116614): run-time error CSS1038: Expected hex color, found '#NaNNaNNaN' (1073,116707): run-time error CSS1038: Expected hex color, found '#NaNNaNNaN' (1074,14604): run-time error CSS1030: Expected identifier, found '.' (1074,14611): run-time error CSS1031: Expected selector, found ')' (1074,14611): run-time error CSS1025: Expected comma or open brace, found ')'

These errors are mainly from following files xenon-core.css, xenon-forms.css & xenon.css It looks like some css syntax is wrong & color code is wrong.

P.S. We are using ASP.NET default bundling & minification.

Hi ak47surve

I am sorry about these issues happing with out theme, this has been previously reported but I am not sure which exact line is generating this error. Is it possible for you to find a way to show the exact line where these errors are being generated so I will give you the proper fix.

I use Mac OS and have a different LESS compiler, which did not generated these kind of errors and I thought everything was ok.

If the file finishes compiling including these errors, then you don’t have to worry about it, I think your compiler uses more strict rules and consists on these errors. But the best case would be to tell me where is wrong so I will fix the color codes and all users can benefit.


Arlind

Excuse me, it seems that there’s a bug in class “menubar-scroll-panel”. The “menubar-foot-panel” is not shown due to he preset “position: relative;” of ”.menubar-scroll-panel”.

To fix this, change ”.menubar-scroll-panel” to “position: static;”.

Is it correct? Thanks.

Hi feng-icewine, thank you for reporting this, we will fix this on the next update.

Kind Regards,
—Ylli

Hi, I’m trying to use the ‘Add Members’ template however it’s raising an error around the multi-select portion of the template. The template for me does not show or have the DOM elements related to the 2 multi-select lists, instead the main list (#multi-select) is showing. The error reads, “TypeError: $(...).multiSelect is not a function…” Here’s an image that will hopefully help. http://chilp.it/101c782

Thanks.

Never mind, I have it all working now.

Ok, one other thing regarding the multi-select template, how would I incorporate a validity check? For example the user clicks the save button but there are no selected items in the multi-select how could I edit for that using date-validate=’required’ for instance? I have an ng-model=”selectedValuesList” on the <select> to keep track of the selected values in the list if that helps at all.

Troy

Hi Troy

To know if the user has selected any of values just use the simple jQuery validation check:

$( '#multi-select' ).val().length == 0 // means its empty

I hope this will help you.


Arlind

Hi, I cant use ng-repeat with the tables. Table sorting and highliting doesnt work. Please help.

Thnx in advance. Onur

Hi Onur

I suggest you to “angulify” the call of DataTables, please try importing this library:

http://l-lin.github.io/angular-datatables/

In the time Xenon was developed, this library was not published and so other users have managed to integrate it.

In the next update I will change the DataTables implementation in Xenon-AngularJS and include the library mentioned above.


Arlind

Thanks!

Glad to hear that patronovski :)

P.S: It would help us a lot if you could rate Xenon on themeforest from your Downloads tab, ( if you don’t know how, just open this link ) :)

Kind Regards,
Arlind

Hi, another issue…. The validate directive has a little problem that prevents it from getting the equalTo message…. jQuery only works with lower case, and equalTo has a upper case “T”. So, to correct it, in the directive you shoud use:

message = $field.data(‘message-’ + params1.toLowerCase());

Instead of:

message = $field.data(‘message-’ + params1);

Cheers, Alexandre

Hi Alexandre

I am not sure what is going wrong here, can you please explain a little to me so I can give you a concrete answer to this question.


Arlind

Hi,

My submenuitems link doesnt seen in screen so link doesnt work.

var task         = this.addItem('is Emirleri',      '/app/task',                'linecons-desktop');

task.addItem(‘Bakim’, ’-/service’, ‘fa-check-square-o’);

Render like this;

a href=”#” ng-include=”’menu-item-link-tpl’” class=”ng-scope”

What do I need to see links?

Thanks

it is ok now. i fixed it.

Glad to hear that :)

Kind Regards,
—Ylli

by
by
by
by
by
by

Tell us what you think!

We'd like to ask you a few questions to help improve ThemeForest.

Sure, take me to the survey