EmberJS - Change property except for index route - ember.js

I have the following routes, controllers and views:
products
products.index
products.product
products.category
products.new
I view a list of products on products. For all other routes, except for products.index, I want to change the property blurred on the products controller (which blurs the list), so I can view a template on top of it.
Where and how should I do this? Is this something I should put in the view or the controller? I need to be able to determine which route is the child of products.
Update
I need the list on products so it stays in tact, this way the scrollposition is remembered and most importantly, I can 'blur' the product list and show templates on top of it.

The index route was created for this very purpose. I'd recommend just moving that list from products into the products/index template. Then it'll only show up when you're on /products and won't show up any time your on any route/resource deeper.
If you don't want to do that, then you could easily put it in your controller, and follow the pattern shown in this answer: State of nested routes in EmberJS

Related

Ember parent route changes without child route changing

On one Ember route, I have one side a list of records (foos) on the left, and on the other side a form. Usually, I'd route it like so: /foos/bar/1/edit. However, I also have a list of baz records, that can be displayed on the left, next to the form.
Ideally, I'd like to be able to have the user be able to alternate between the two lists on the left, while preserving the form on the right.
My first attempt to do this was to load both lists in the same route, and toggle them with a tab jQuery plugin. However, this poses several problems related to pagination and back button/refreshing.
I've also tried putting the lists in their own routes (i.e. /foos/bars/1/edit and /bazs/bars/1/edit). But I can't figure out how to link to a different list without losing the edit page.
Is there a better way to accomplish this?
I think the best way would be using the separate routes but instead of /foos/bars/1/edit and /bazs/bars/1/edit having the form in the main parent resource then foos and bazs as the sub resources. That way when you transition the routes for which list you want displayed it will changed the template that gets rendered in the outlet but maintaining the form.

Reusable master/detail view best practice ember

I've been grappling with this relatively simple problem in Ember JS in a variety of my apps. I know this may seem like its been answered seven ways to Sunday but I haven't found a solution that I can actually map to my problem.
Okay, so I need a class master/detail view with a route structure like:
Admin Dashboard
Dashboard
Students page (displays a master list of students in a sidebar)
Student page (upon selecting a sidebar item, it is selected and "details appears"
This pattern is reused exactly at three different dashboards in my site. The only difference is the record array of students is different for each one. I'm asking what is the most Ember-esque way to accomplish this?
I have tried multiple solutions but each one has its own problems. Using the {render} helper to render some universal "students" template breaks because I am leveraging the router and <li> tags inside to automatically apply the active class to the selected student, and students.student isn't a route in my router. If I add that route, then it routes away from the dashboard parent route (with the navbar, etc).
I basically want to package this view into a component almost and pass it the array to display, but then how do I add the "active" class? Surely there is an easier way then manually adding and removing the class.
Thoughts?
I apologize if my question isn't super clear! Its a subtle distinction.

MS Access Web App: set filter on sub view based on master view

My application has a list view (master) containing a data sheet view in a sub view element.
In the list view, I would like to use some control like a button or a combo box to filter the data in the sub view. How can I pass a parameter for the filter from the master view to the sub view?
I don't believe the scenario you are looking at here will be directly possible within the Access web app context. Let me explain.
In Access 2013 web apps, there is no macro action available to requery or refresh a specific control on a view. The same goes for trying to refresh a Subview control on a view. The only way you can pass parameters to a different view in the web app context is by using the OpenPopup macro action. In that case the view will open as a popup which is not what you want here either.
So you might not be able to achieve your end goal. One suggestion that might work is to have say an unbound text box control on the main parent view. For the Subview control, use that unbound control as the Master Field (in the property list). Access will attempt to match records from this unbound control to whatever field you designate as the Child Field property. If you update that unbound text box control on the main view, Access should filter the results in the Subview. I "think" that will work.
It works in my app. SubForm updates with filter when focus leaves the txtbox. Unfortunately, you can only search one field per subview as it is set as a property at design time and AFAIK there is no way to change at runtime.

EmberJS view components and separate data store

I'm looking at creating a google maps component. But I would like it to be self contained so it will have its own model, controllers and views. So for example the component will fetch its own data from the server and I'll also be able to refresh the data when needed. Ideally I'd simply add the component to the current template that is showing, so for example: {{map-view}} and then everything the component needs to do will take care of its self.
The component will also need to listen to triggered events from other controllers as a user will be able to search for a specific location and the map will need to change its position.
Is this possible to do in EmberJS? As I haven't found anything like this, specially when having its own model. I know there is a component in EmberJS but it seems very limited. Am I wrong in thinking this?
the controller cannot have its own model all values must be passed to component. Please refer to ember docs and this Discussion
You can make a google map component and pass the location and marker data to the component. this data will get updated due to ember data binding.
so you can have something like this
{{map-view location=userEnteredValue}}
you can search for ember component talk by Kris Selden on youtube which includes a google map component good for you to start with.
updated
https://gist.github.com/krisselden/8189650

Missing views in container after transition to another route

In the OfferRoute I have a container and a controller's method to add views dinamically to it:
addProduct: function() {
var container = Ember.View.views['containerView'];
var child = container.createChildView(Gmcontrolpanel.InsertProductView);
container.pushObject(child);
}
Everything works fine but if I go to another page on the application and then I come back to the offer page, the child views in the container are missing;
I can see that the HTML output is the empty container:
<div id="containerView" class="ember-view"></div>
Does someone know why is this happening?
Views redraws when you switch pages. So, you get a new containerView instance with empty children list every time.
I'm not recommending to use Em.View.views object for that task. If you need to store state of data between redrawing, it's more likely controller job, and containerView needs to bind to this controller.product list and display each product.
It's possible that {{#each}} helper or custom CollectionView is what will help you to solve the task more elegant.