I'm using AngularJS with ui-router for my website.
I have a multi-level menu (when you select one item, you can see next menu's level)
home | about | contact us
NY | LA | SF
Street1 | Street2 | Street3
So, at this example we looking at Street3 details, in LA in Contact us page. All selected items is active.
I can't make it with ui-router's ui-sref-active="active" because it's highlight only last item (Street3) Other items are not active, but should be.
Are there any ideas to fix it?
Thanks
You can always use $state.includes(stateName) to check if the current active state is equal to or is the child of the state stateName. Combine it with ng-class, you will get to highlight the correct tabs.
Here is a working example.
Related
I am using the below code to display the toggle button with active/inactive texts. But for automation testing purpose I need to add unique id/attribute for active and inactive individually. By using the below format, I can see both active and inactive in console.
Can anyone help me with this please?
<lightning:input type="toggle" checked="{!item.IsActive}" onchange="{! c.handleChange }" messageToggleActive="Active" messageToggleInactive="inactive"/>
For example a table is repeating itself on all the 3 tabs of the page with following element.
[ng-repeat="(key, r) in $data track by key"]
How do i grab the rows of the table on a specific tab.
Using the regular element(by.repeater) .. returns results from all the tabs
You could wrap each tab with an ID and select it via
element(<locator of active tab>)
// find the active tab firstly to tell the next element(by) in the chain:
// 'your find context is the active tab'
.element(by.repeater(...))
I'm working on an AngularJS project, also pretty new to this and have managed to create a dependent drop-down menu.
Example:
Parent Drop-down- Cars
- Bikes
Child Drop-down- BMW, Audi
- Yamaha, Honda
So from the above example, if I choose Cars in the first drop-down it will display BMW and Audi in the second drop-down. Same for bikes.
Now if the user chooses BMW and clicks the submit button I want it to redirect to a URL which contains a JSON file and display the result in the form of a table.
If the user chooses Yamaha similarly it should redirect to another JSON URL and display the result in a table.
How can this be achieved in AngularJS, with a single "Submit" button?
Any help is much appreciated.
Regards.
Your vehicle dropdown should have unique ID such as cars for 1, bikes for 2 here 1 and 2 are unique ID for this category of vehicles.
Now on submit call a function which will take you to another page now, send this uniqueID of vehicles into statparams and on that page and on page OnInit make a http call and bind the models to that dropdown.
I am using Angular Utils Pagination Directive in my app. Basically it works fine but problem is that when I filter table it doesn't show first page . For example in this plunker when I searched "meal 12" it hides the paging directive because it contains 1 record which is less than pagesize. I donot want to hide that instead it should show page1 . If filter is great than pagesize it works but when items less than pagesize it hides .
<li dir-paginate="meal in meals | filter:q | itemsPerPage: pageSize" current-page="currentPage" auto-hide="false">{{ meal }}</li>
I tried auto-hide="false" it doesnot work.
Need help?
You have an old version of the library, the version you have (at least, whats in your plunkr) doesn't support the auto-hide property.
Secondly, auto-hide is a setting for the controls, not the list, so you need to put it on the dir-pagination-controls element.
I don't have too much experience with Backbone.js, so please excuse my ignorance if I've completely missed something here.
I have an app that has a sidebar which is linked to a Router object, when the user clicks one of the links I send a navigate event. But that's not useful on its own.
What I have is a static sidebar on the left, then a .pane element on the right. The .pane is just a wrapper for what will be dynamically loaded content. I've made this its own view, but what I need to do is add a sub view into it when the user clicks on a link in the sidebar.
|--------------------------------------- |
| Link | |-----------------------------| |
| Link | |.pane | |
| Link | | | |
| Link | | | |
| Link | | | |
| Link | |-----------------------------| |
|--------------------------------------- |
Any ideas?
I think you should load a view with the nav bar on the index state.
Then, each link wil change the url. For each url, set a router state, wich calls another view for each menu item.
If you still don't get the idea, you should watch some backbone tutorials mate.
You can find some on:
http://www.tutsplus.com
http://www.backbonetutorials.com
Hope it helps