How do I redirect a user when a button is clicked?
C#asp.net MvcHtml Helperhtml.actionlinkC# Problem Overview
I have a view with a button. When the user clicks the button I want them redirected to a data entry view. How do I accomplish this? I should mention the views are created, tested, and functioning. I can get to them by typing the url.
I looked for steps explaining how to wire up the onclick event of the button but I'm new to MVC and kinda lost at this point.
Thanks!
C# Solutions
Solution 1 - C#
It depends on what you mean by button. If it is a link:
<%= Html.ActionLink("some text", "actionName", "controllerName") %>
For posting you could use a form:
<% using(Html.BeginForm("actionName", "controllerName")) { %>
<input type="submit" value="Some text" />
<% } %>
And finally if you have a button:
<input type="button" value="Some text" onclick="window.location.href='<%= Url.Action("actionName", "controllerName") %>';" />
Solution 2 - C#
Just as an addition to the other answers, here is the razor engine syntax:
<input type="button" value="Some text" onclick="@("window.location.href='" + @Url.Action("actionName", "controllerName") + "'");" />
or
window.location.href = '@Url.Action("actionName", "controllerName")';
Solution 3 - C#
If, like me, you don't like to rely on JavaScript for links on buttons. You can also use a anchor and style it like your buttons using CSS.
<a href="/Controller/View" class="Button">Text</a>
Solution 4 - C#
if using JQuery, you can do this :
<script type="text/javascript">
$('#buttonid').click(function () {
document.location = '@Url.Action("ActionName","ControllerName")';
});
</script>
Solution 5 - C#
It has been my experience that ASP MVC really does not like traditional use of button so much. Instead I use:
<input type="button" class="addYourCSSClassHere" value="WordsOnButton" onclick="window.location= '@Url.Action( "ActionInControllerHere", "ControllerNameHere")'" />
Solution 6 - C#
Or, if none of the above works then you can use following approach as it worked for me.
Imagine this is your button
<button class="btn" onclick="NavigateToPdf(${Id});"></button>
I got the value for ${Id} filled using jquery templates. You can use whatever suits your requirement. In the following function, I am setting window.location.href equal to controller name then action name and then finally parameter. I am able to successfully navigate.
function NavigateToPdf(id) {
window.location.href = "Link/Pdf/" + id;
}
I hope it helps.
Solution 7 - C#
You can easily wrap your button tag with tag.Using Url.Action() HTML Helper this will get to navigate to one page to another.
<a href='@Url.Action("YourAction", "YourController")'>
<input type='button' value='Dummy Button' />
</a>
If you want to navigate with javascript onclick() function then use
<input type='button' value='Dummy Button' onclick='window.location = "@Url.Action("YourAction", "YourController")";' />
Solution 8 - C#
$("#yourbuttonid").click(function(){ document.location = "<%= Url.Action("Youraction") %>";})
Solution 9 - C#
RIGHT ANSWER HERE: Answers above are correct (for some of them) but let's make this simple -- with one tag.
I prefer to use input tags, but you can use a button tag
Here's what your solution should look like using HTML:
< input type="button" class="btn btn-info" onclick='window.location.href = "@Url.Action("Index", "ReviewPendingApprovals", routeValues: null)"'/> // can omit or modify routeValues to your liking
Solution 10 - C#
<li class="nav-item">
<a class="nav-link text-dark" asp-area="" asp-page="/UsersPage">Users</a>
</li>
Try this
Solution 11 - C#
You could just add the bootstrap classes to make your action link into a button if you are using bootstrap that is
@Html.ActionLink("Create A New Invoice", "Create", "Travel", null, new { @class = "btn btn-primary btn-large" })