correct syntax for runat server a button with MVC 6 .net core and bootstrap

Question

I'd like to know how to create a simple button action, in MVC 6 core web application with bootstrap. So that i for example could execute a sql stored procedure, or simply retrieve a date from server, or retrieve something else by code from the server upon request, and display it in a textbox. Especially i like to know the minimal code without fancy decorations.

<asp:???  input type="button" runat="server" onclick="btn_Click" class="btn btn-default">

or perhaps

<div>
<button type="button" class="btn btn-default" runat="server" onclick="btn_Click">
</div>

its perhaps a simple question but i get confused on how it should be done in MVC-6 and not in older versions or asp pages

RonC · Accepted Answer · 2017-05-11 13:20:29Z

2

It's not called MVC 6 anymore. It's now ASP.NET Core 1.0. The runat="server" is not used in ASP.NET Core 1.0 since it does not support web forms but instead relied on the MVC paradigm. For the same reason there is no onclick attribute either.

So you button might look like:

<button type="submit" class="btn btn-default">Click Here</button>

And the action method on the controller might look like:

    [HttpPost]
    public IActionResult Post() {
        /*do work here*/

        return View();
    }

Full Example

In the comments you asked for an example of how one can tell which button was clicked if there were multiple buttons on the form. Here is an example:

/Views/example/index.cshtml

<html>
    <body>
        <form asp-controller="example" asp-action="Index">
            <label>Value:</label><input name="someValue" type="text" maxlength="10" />
            <button name="btnOne" type="submit" class="btn btn-default">Click One</button>
            <button name="btnTwo" type="submit" class="btn btn-default">Click Two</button>
        </form>
    </body>
</html>

/Controllers/example/ExampleController.cs

using Microsoft.AspNetCore.Mvc;

namespace App.Web.Controllers {

    public class ExampleController: Controller {

        public ExampleController() {

        }

        [HttpGet]
        [Route("/example/")]
        public IActionResult Index() {
            return View();
        }


        [HttpPost]
        [Route("/example/")]
        public IActionResult Index(string someValue) {
            string buttonClicked = "";


            if(HttpContext.Request.Form.ContainsKey("btnOne")) {
                buttonClicked = "btnOne";
            } else if(HttpContext.Request.Form.ContainsKey("btnTwo")) {
                buttonClicked = "btnTwo";
            }

            return View("Index");
        }

    }
}

You can learn more about forms in ASP.NET Core here: https://learn.microsoft.com/en-us/aspnet/core/mvc/views/working-with-forms
They are amazingly flexible compared to webforms but the learning curve is a bit steeper at first.

edited May 11, 2017 at 13:20

answered Nov 14, 2016 at 15:33

RonC

34.4k21 gold badges105 silver badges150 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Peter Over a year ago

interesting, so there is no runat=server but its the redirector that takes this task by hooking (IActionresult Post) [HttpPost]. Then i wonder if you have multiple buttons for different actions how dwould you detect which one was pressed in your example ?

RonC Over a year ago

Typically the action method name reflects the name of the view it handles, in this case Post, so that typically stays fixed for the view (aka page). So to know which button was clicked you typically give your button a name via the button's name attribute then that name will get posted back with the rest of the form data and you can check for the presence of that name in data posted back to see which button was clicked.

Peter Over a year ago

Thanks, i am learning asp.net core but find it difficult to understand this concept, do you know maybe perhaps a small sample where it is shown what you just described in your last comment ?

Peter Over a year ago

though the controller should be in the controller folder right ?. I learned views are mainly for client views (visual candy), and dont contain processing logic, for the sample its an eye opener for me thanks !, i wish i could give you more points for that.

RonC Over a year ago

True controllers are typically in the Controllers folder. I updated my example. I personally keep my controllers with my views because I don't like bouncing between two separate folders but standard approach is to put them in the Controllers folder.

Collectives™ on Stack Overflow

correct syntax for runat server a button with MVC 6 .net core and bootstrap

1 Answer 1

Full Example

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Full Example

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related