Redirecting to another page on a button click

[Matthew Walton]

I've looked around and all the examples I can find for the redirect port are so old that the links are now dead. I know the port exists, it's in the docs, but I haven't really quite got my head around this enough yet to understand how to make it work.

I have an ordinary Elm architecture app. It's using Effects. It contains a button which, when clicked, I want to make redirect the browser over to another URL. I suspect I can make an Effect which does this somehow, but I honestly have no idea how. I'd greatly appreciate a nudge in the right direction as I'm running out of time.

Thanks,

Matthew

[Kevin McGee]

A stone simply approach would be use HTML -- replacing the button with a styled link (anchor tag), to leverage traditional browser behavior.

Both buttons and anchors inherit to same Focus and Accessability stuff AFAIK.

Not sure if this would fit your situation but in the interests of time...

[Matthew Walton]

In the interests of time I made my own redirect port and hooked up a callback to it in the containing page that just passed the values to window.location. Works like a charm.

I'd still like the documentation to elaborate on these built-in ports though.

[Isaac Shapira]

I feel like redirects should be Tasks. Something like this:

```

redirect : String -> Task x ()

```

Then it can just be passed to a port.

?

[Ryan Rempel]

For an example of one way to implement such a Task, you could look at `WebAPI.Location.assign` and `WebAPI.Location.replace` here:

https://github.com/rgrempel/elm-web-api#webapilocation

[Amitai Burstein]

For me, Ryan's elm-route-hash is working really nicely, as it integrates so well without taking over the app's logic.

[Ryan Rempel]

Though I think the original poster was looking at techniques for redirecting to an entirely different URL -- that is, actually fetching a new URL from the server -- whereas elm-route-hash implements single-page-app principles. Of course, if you want to turn your app into a single-page-app, it could help ...

[Joe Marty]

I know this is an old post, but it still ranks pretty high in Google, so I thought I'd post the newer solution: http://package.elm-lang.org/packages/elm-lang/navigation/2.1.0/Navigation#load