520 comments found.
I am having some troubles with adding new pages to my xenon web application. Every time I add a new page to the app/views folder it displays the page. However, if I add a calendar, nestable lists, etc… it does not display the javascript files needed to work correctly. For example: after adding the calendar the jquery-ui.min, moment.min.js, and fullCalendar.min.js are not displaying (There is not an error either, it just doesn’t display the content nor initiate). I have checked the path multiple times and I am using the correct path. Although, if I use one of the existing filenames (such as calendar in extra/calendar – it works). It seems as though, your filenames are somehow incorporated in the app.js file to allow the JS file to initiated. Thank you for your assistance in this matter.
Thank you for your reply. Would you please be able to state which file explains how to add menu items. I am working in the angularjs templates. Thank you so much for your time.
Hi again
Sure, just open /app/js/services.js file go to line 86 and you will see:
http://cl.ly/aGVPRoot elements are added directly using this and sub menus are added to their instances for example dashboard
// Subitems of Dashboard
dashboard.addItem('Dashboard 1', '-/variant-1'); // "-/" will append parents link
dashboard.addItem('Dashboard 2', '-/variant-2');
dashboard.addItem('Dashboard 3', '-/variant-3');
dashboard.addItem('Dashboard 4', '-/variant-4');
So the first parameter is title of menu, the second is ui-route path.
I hope this will help you to understand how menu is managed.
Hi man, this is a really nice template. Could you share with us if you are planning any new updates and what are you planning to include on it or just planning your new project?
Thanks
when do you think you will release more features or a big update?
Beautiful work!
Can you list what PSD files are included? Thanks
Hi
We only include two files as our desinger gave us the components separately and we have no full psd files:
Here is how they look:
http://cl.ly/aEJELogin and Dashboard page.
Hei,
I am trying to use datepicker in an angularjs application. I dont know what i am not doing right because i cant get the date calendar to pop up when i click the input box… Here is my html
<input type=”text” class=”form-control datepicker” data-format=”DD-MM-YY”>Please help.
Hi,
I am using the HTML version of xenon and I have an issue with the csv / xls export module. The export works fine with the angular version but not in the HTML version. I have checked on your demo and it’s the same problem. Can you please advise how to make the export work ?
This is my javascript:
var tableTools = new $.fn.dataTable.TableTools( table, {
sSwfPath: assets_url+"/js/datatables/tabletools/copy_csv_xls_pdf.swf",
aButtons: [
"csv",
"print"
]
});
$( tableTools.fnContainer() ).insertBefore('#'+table_id);
I can see the csv button but it wont export. I checked and the swf is loading properly.
Thanks
Hello,
I’m having issues with the notification dropdown in mobile view. When you click on the icon such as the fa-bell-o with the colored badge on it, nothing happens and it closes the horizontal menu. I noticed that someone else reported this too. Have there been any fixes yet?
Thanks
Hello pmptech,
I tested that on our live demo, on HTML and AngularJS version and i can’t replicate the problem.
Can you please provide us with more information about his issue, for instance it is happening on HTML version or on Angular JS, and on which page particularly or on all of them?
Thanks,
Ylli
Here is a link to my live site, you can see for yourself that the mobile notifications are not working on any pages. Thanks
http://si.pmpros.co/#/app/dashboard-variant-1Is there an email that I can send my code to so you can inspect it and see what might be causing it on my side? Thanks
Nice template, quick question… I’m trying to use jQuery inside an angularJS directive, but the jQuery is being processed before the angularJS directive is firing (i.e. datatables inside tabs)
<tabset> <tab>HI jth_92
To run jQuery and all custom scripts you can do this with Angular Directives:
https://docs.angularjs.org/guide/directive http://www.sitepoint.com/practical-guide-angularjs-directives/And Controllers:
https://docs.angularjs.org/guide/controller http://viralpatel.net/blogs/angularjs-controller-tutorial/Please read these articles and they will guide you how to use directives (or controllers), inside controller/directive you can put the logic of jQuery it will be executed only when its fully rendered.
I hope this will help you.
Awesome! Thanks.
Hello,
I’m interested in both Neon and Xenon, angularJS versions. But I still haven’t found the big difference between them. Can you guide me? What does one have that the other doesn’t?
Some guidance would be great to make the right choice. It’s not about the money, but because I’m going to develop a very big software over it and I don’t want to screw it.
Thanks,
The difference is in the design and also in the development, Neon was our first admin theme so what we developed in Neon in Xenon was improved even more.
Regarding the design it is all a matter of taste, but the charts used in Neon are multiple charts and graphs combined which are free while in Xenon we have used the most advanced chart system used by the most known technology brands – DevExpress charts.
Kind Regards,
Art
Thanks for the answer.
I don’t know if I saw it wrong, but few days ago I read that Neon supported AngularJS. Now I enter to the preview but there’s nothing about Angular, not even in the description.
Does Neon support Angular just like Xenon? If so, HTML version has the exact features as Angular version?
Thanks,
Santiago
Can I use datatable with ng-repeat? ‘Cos I am getting some wiered behavier after I try to sort/search something. All
Hi,
Really great template! Thanks ! However I have one question. Is there an easy way to make a fixed page-title. I want to have fixed sidebar, fixed header and fixed page-title? Thanks
No worries, it’s not urgent, wish him to get well soon !
Are there any updates on that ? Thanks
Hi shaltas
Sorry for late reply as I couldn’t reply to you earlier for the reasons described above.
To achieve this, simply add “is-fixed” class to “page-title” element in that page:
Here is the css for is-fixed
.user-info-navbar.is-fixed,
.page-title.is-fixed {
position: fixed;
width: 100%;
z-index: 20;
}
.user-info-navbar.is-fixed {
top: 30px;
}
.page-title.is-fixed {
top: 107px;
}
.main-content {
padding-top: 200px !important;
}
This will do the trick.
Hi, Thanks for that. It works well in desktop mode but problems starts in mobile version since the header is smaller. Is there an easy way to have different top positions for different media ?
Thanks!
Sure, please refer media query for mobile devices:
@media screen and (min-width: 768px){
.user-info-navbar.is-fixed,
.page-title.is-fixed {
position: fixed;
width: 100%;
z-index: 20;
}
.user-info-navbar.is-fixed {
top: 30px;
}
.page-title.is-fixed {
top: 107px;
}
.main-content {
padding-top: 200px !important;
}
}
So replace the existing code and it will only be applied when browser viewport is larger than 768px (increase or decrease this value if you want).
Setting width: 100% made it 100% however sidebar push it by width of the sidebar. And it cuts the last bit of the page-title. To solve this I made like this
width: -moz-calc(100% - 340px);
width: -webkit-calc(100% - 340px);
width: -o-calc(100% - 340px);
width: calc(100% - 340px);
However if sidebar is collapsed then pagetitle becomes too short. To fix that I changed js to add/remove sidebar-collapsed to page-title and changed CSS
.page-title.is-fixed {
width: -moz-calc(100% - 340px);
width: -webkit-calc(100% - 340px);
width: -o-calc(100% - 340px);
width: calc(100% - 340px);
}
.page-title.is-fixed.sidebar-collapsed {
width: -moz-calc(100% - 80px);
width: -webkit-calc(100% - 80px);
width: -o-calc(100% - 80px);
width: calc(100% - 80px);
}
This seems to work ok. Would love to hear If there are better way of doing this.
Thanks
how do we position the chat dialog that is attached when you click on someones name on the right side http://screencast.com/t/hTrkDByTekaH
right now it seems like this is set to show in the same place and not next to the item you clicked. any solutions here?
Hi,
I’m trying to add ‘auto-inherit-active-class’ to the main menu but it does not seem to be working. This is the comment line for the class:
<!-- class "auto-inherit-active-class" will automatically add "active" class for parent elements who are marked already with class "active" -->
How can I get this to work as I’m trying to build a dynamic menu, and this would be very helpful. Thanks.
HTML5 version
Any chance in making the file upload button “Browse” look like all the other buttons, we are in the process of moving from neon to xenon, but the test users just don’t like the old ‘Browse’ button. I’ve tried but just can’t get it to look correct inside the template, and they just won’t sign off.
Note Using dropzone is NOT an option on this project.
ps if bribery helps it will also upgrade to extended license, when it goes live later this year !!!
Hi David
I have now noticed that this feature is missing and we are going to implement it in the next release. For your information you can use Jasny File Input to style your own upload button:
http://jasny.github.io/bootstrap/javascript/#inputmaskI hope it will help you.
Thanks, will try his
Hi,
Just wondering how I edit the style of the bars? Is this within the theme or limited to the chart designs. I am trying to get the total number of medals displayed beside the country name on the stacked bar.
Any help would be appreciated. Cheers
Hi there,
the bar colors can be changed to any color you want, you need to edit the DevExpress charts, you can read more about them and how it works here:
http://js.devexpress.com/WebDevelopment/Charts/Kind Regards,
Art
Awesome thank you I have manage to edit the bars using the link above.
Hi, we´re getting this error “Unclosed block” everytime we compile your less files using grunt-contrib-less. Trying to fix this error we saw that there is a problem in .keyframes(...) inside lesshat.less file, it is adding a (”;”) before the last (“}”) in some animations ,see the example bellow.
.xe-widget.xe-weather .xe-background.xe-background-animated lesshat-selector { -lh-property: 0; } @-webkit-keyframes weatherBgMove{ 0% { left: 0%; } 50% { left: 10%; } 100% { left: 0%; }} @-moz-keyframes weatherBgMove{ 0% { left: 0%; } 50% { left: 10%; } 100% { left: 0%; }} @-o-keyframes weatherBgMove{ 0% { left: 0%; } 50% { left: 10%; } 100% { left: 0%; }} @keyframes weatherBgMove{ 0% { left: 0%; } 50% { left: 10%; } 100% { left: 0%; }; }
When we erased the content of .keyframes(...), the compilation was successfull but obviously some animations were lost.
Please check .keyframes(...)
Hi cleqo
On my machine it compiles successfully and it shows no errors, which is hard for me to know which exact keyframe is causing this. Can you please remove the keyframes one by one till the file compiles successfully and that will let you know which line is causing this issue, this is the best way to fix the issue.
Hi, I am making an form in which I have an <select> filed. I am trying using the validation on this but it does not seem to work? How do I use: data-validate=”required” on an select field?
Thanks for a great script 
Hi jmansa
I am sorry for the delay of reply as I was not available for one week in the office as I was ill. Now I got back and can help you.
To add validation to your fields, you must import jquery.validate library in the document and to make it required the first option of select field must have value to empty:
<option value="">Select your ...</option>
Hi, just as @hasanaydogar, I am unable to set the skin using the layoutOptions.skins.horizontalMenu options. From a quick search, the only place where skins seem to be applied is exactly in the demo you create, i.e., the app does not load the set option by default.
I was able to fix it by adding public_vars.$body.addClass(“horizontal-menu-skin-” + $layout.get(‘skins.horizontalMenu’)); in the line right after public_vars.$body is initialized in the MainCtrl controller. Do you foresee any non-intended consequences of this?
Please adopt your wizard to a real angular wizard.
e.g.: https://github.com/mgonto/angular-wizardHi,
Just wondering how I edit the style of the bars? Is this within the theme or limited to the chart designs. I am trying to get the total number of medals displayed beside the country name on the stacked bar.
Any help would be appreciated. Cheers
