创建控制器

在**Controllers**文件夹下创建**MajorController**控制器类文件。

**MajorController**代码如下所示：

```
public class MajorController : Controller
{
    public IActionResult Index()
    {
        return View();
    }
}
```

控制器中默认有一个名为**Index**的**Action（动作）**，它返回一个同名**视图**。

# 创建Add动作

在控制器中创建一个名为**Add**的**Action**，并返回**视图**。

代码如下：

```
public IActionResult Add()
{
    return View();
}
```

# 创建Add视图

在Views文件夹下的Major文件夹下创建名为Add.cshtml的视图。

### 添加标题

通过ViewBag.Title可以设置当前页面的标题，代码如下：

```
@{
    ViewBag.Title = "添加专业";
}
```

赋给**ViewBag.Title**的值会替换掉**_Layout.cshtml**布局文件中的`@ViewBag.Title`。

### 添加模型

通过`@model Major`可以将**Major**类设置为视图的模型。

但是仅仅添加`@model`指定是不够的，还需要指定**Major**类所处的命名空间，因此还需要在前面加上`@using StuInfoManaSys.Models`。

代码如下：

```
@using StuInfoManaSys.Models
@model Major
```

### 添加表单

Add视图的作用是将专业的名称提交给控制器，因此可以创建一个表单form，并将请求方式设置为post。

我们可以给通过`style="width:320px;"`给它一个320像素点的宽度。

再通过bulma的样式属性`class="mx-auto"`让表单居中。

代码如下：

```
<form method="post" class="mx-auto" style="width:320px;">

</form>
```

### 添加输入框

通过`<input asp-for="Name" class="input">`可以添加一个`name="Name"`的input输入框。

通过bulma可以美化样式。

最终代码如下：

```
<div class="field">
    <label class="label">专业名称</label>
    <div class="control">
        <input asp-for="Name" class="input">
    </div>
</div>
```

### 添加按钮

通过button标签可以定义一个按钮，同样可以通过bulma美化按钮样式。

代码如下：

```
<div class="field">
    <button class="button is-primary is-fullwidth">提交</button>
</div>
```

### 运行

运行项目后，将项目地址设置为**/Major/Add**，可以看到表单最终的效果如下：

![image-20240817130049518](https://image.nyazira.top/Article/image-20240817130049518.png)

# 创建post请求Add动作

在**MajorController**中再创建一个名为**Add**的**Action**，但是这个Add有一个类型为**Major**的参数用于接收请求的数据。

但是，由于现在有2个名为**Add**的**Action**，请求**Add地址**时，控制器不知道应该触发哪一个**Action**，因为如果不设置**Action**的请求类型，它会默认接收所有类型的请求。为了区分，可以通过**[HttpPost]**将第二个**Action**设置为只接收**post**请求的**Action**。

代码如下：

```
[HttpPost]
public IActionResult Add(Major model)
{
    return View();
}
```

# 获取MajorRepo

要将接收的数据存入数据库中，还需要调用继承了**MajorRepo**类基础了**BaseRepository**基类的**Insert**方法。

通过构造函数声明，我们可以很轻松地获取一个**MajorRepo实例**。

代码如下：

```
public class MajorController(MajorRepo majorRepo) : Controller
{
    //其他代码
}
```

# 调用Insert方法

在**Add**中调用**MajorRepo**的实例**majorRepo**的**Insert方法**，并将**model**传入其中，便可将数据添加到数据库中。

代码如下：

```
[HttpPost]
public IActionResult Add(Major model)
{
    majorRepo.Insert(model);
    return View();
}
```

# 重定向到Index动作

将`return View();`修改为`return RedirectToAction("Index");`，这样会在数据插入成功后重定向到**Index**动作。

# 测试

重新运行项目，来到**/Major/Add**地址，在专业名称中输入一个专业名称，如**软件工程**，点击提交。

提交后，页面会出现异常，这是因为页面重定向到了Index动作，而Index动作返回一个视图，但是我们没有创建这个视图，因此会报错。如果不行看到这个报错，可以提前创建Index视图。

但是在数据库中，可以看到**Majors**表中会多出一条记录，**Name**为刚刚提交的名称，**Id**会自动随机生成。

> 修改代码后2种使代码生效的方法
>
> 1是重新运行项目，也就是按Ctrl+F5，这种方式就是将项目中的代码重新编译后运行
>
> 2是热重置，快键键是Alt+F10，图标是浅绿色三角形旁边的红色火团，它只需要编译部分代码就可以更新项目
>
> 重新运行速度慢点但是稳妥，热重载速度快但是有时候会出错
>
> 可以优先使用热重载，等出错后再试试重新运行项目，可能错误就会消除

创建控制器