React-router working with list - reactjs

I have a list of users and a sidebar
after clicking on a list item, i get a full information about user in a sidebar, but i don't know how to change "url" when a user is being clicked.
I don,t need to render another page, i just need to change window "href" after clicking on a user, this link should be reusable, i mean i can send it to someone and he will see the clicked before user.

react-router-redux package give you a reducer, actions to do what you want.

Related

Using React Router to invoke state/functions?

I have a material-ui drawer, when the user clicks a button to open the drawer I'd like the url to change without a navigation actually happening, if someone visits the url (such as url.com/drawer) they'll land on the page with the drawer already open (or at least in the process of opening).
I would probably put ?drawer=open as a query string parameter rather than have it be a dedicated route. When the button is clicked, navigate to the current route with ?drawer=open appended, either by having the button actually being a styled Link, or using history.push.

AngularJS: Two Parallel Views, One URL

I'm building a dashboard/control panel app that is basically made up of two tabs (bootstrap) at the root level, called "dispatch" and "admin". Each tab has a good bit of its own multi-tiered navigation and functionality, and they don't need to directly interact with each other. The problem I'm running into is how to deep-link to sub-views within one of the tabs without losing the "state" of the inactive tab. To clarify, I can achieve this just fine if I don't worry about updating the URL, but when I try to add deep-linking, that's when I get stuck.
An example of the desired behavior:
When you click on the "Admin" tab, the route becomes "/admin"
Click on a sub-nav item, route becomes "/admin/foo"
Select 3rd-tier sub-level item, route becomes "admin/foo/thing1"
Click on the "dispatch" tab, route becomes "/dispatch"
Click back on the "admin" tab, route goes back to "admin/foo/thing1"
So basically, if you're at the "admin/foo/thing1" route in the middle of filling out a text field, then switch to another tab, then switch back, the text field should still be there just as you left it.
Like I said, the problem isn't switching from tab to tab, since by default the tabs just show and hide things on the page without reloading any views dynamically. I just don't know how to deep-link to a given tab's "bookmarked" position when you switch to it. The way I keep thinking of it is that clicking on a tab should only update the first segment of the URL(/admin or /dispatch), and then some sort of $watch function would update the remaining segments based on the last "location" within that tab. Would something like that work?
Also, I'm using ui-router to handle all my routing and states, so I have to factor that into how I'm going to handle the desired behavior.
Help?
I worked on both those topics (deep state reactivation and parallel states) and integration into ui-router. Grab my github fork of ui-router and build using grunt. Then, mark your two tab states as parallel: true and deepStateRedirect: true.
Git repo: https://github.com/christopherthielen/ui-router
Example plunker: http://plnkr.co/edit/YhQyPV?p=preview
Discussion: https://github.com/angular-ui/ui-router/issues/894
I would just save the current state in a variable, then either dynamically change the link of the tab to whatever the last subview was.
For example, if the user is on /admin/billing, the Admin tab would link to admin/billing. When they leave that tab, the /admin tab remains the same. If you are using ui-router, you can do this with ui-srefs. You could also just manually check the variable when the state changes, and route the user there from the controller.

How can I feed two Marionette modules a piece of info from an appRoute?

I have an app with a Sidebar, which is its own module with its own region, and a primaryRegion that can show views from two other modules (a Dashboard view or a Detail view of an item selected from the sidebar).
When an item gets clicked in the Sidebar, it changes its display to show that it's been selected and gets displayed in the primaryRegion.
The problem I'm running into is that I've recently added routes to the app to directly display item details in the primaryRegion and I can't maintain this behavior when going directly to the Detail view for a given item.
Given that only one module can respond to a route, how can I get the Sidebar to select the item designated in the URL and also display that item's Detail view in the primaryRegion without using a global object or introducing race conditions?
Apologies for the lack of code, I'm having a hard time reducing it down to the essential parts while keeping it clear. Hopefully my description is good enough but if not please let me know and I'll provide more detail.
I can think of two options you could try:
Have Detail fire a global event when it renders, and have the Sidebar be listening for that event and highlight the correct item based on the data it gets from that event.
Or have your Sidebar handle the routing and use a variable route to determine what Detail to render. For example, have a route in the Sidebar of 'details/:id': showDetails' and then a function like:
-
showDetails: function(id) {
// highlight item with id === id here
this.primaryRegion.show(new Details(id));
}

Got to specific tab on button/link click, ExtJs tabpanel

I've a ext js tab panel defined with some tabs.
On the same page I've a menu of hyper links for asking user which tab to open.
I want open the selected tab when the user clicks the link.
Basically when u click on the tab header to open the tab, I want exact same thing to happen on clicking some button/hyperlink.
Seems like a pretty normal thing, but I can't find the solution anywhere!!
Please help.
thanks
ues setActiveTab( newItem ) method of tabpanel.You can pass an ID, index or the component itself as newItem.

Salesforce Action buttons in enhancedlist

Is there a way to add a custom button to the action section of the apex:enhancedlist?
Thanks
Frank
Frank,
To my knowledge you cannot create an <apex:commandbutton> from which you can invoke controller actions, however you can create a 'Custom Buttons and Links' style button from the setup menu. If you go to the Custom Buttons and Links section for the sObject that you are feeding to the type attribute of your enchanced list, you can create a button whose display type is 'List Button'. Then it will show up on any enhanced list component of that sObject type. As I mentioned, you can't invoke a controller action, but you can navigate to an arbitrary URL, display a Visualforce page, or run arbitrary javascript that way. Hope that help you.

Resources