数据增删查改——单表新增

（作者：郭鑫 撰写时间：2019年5月1号）

新增要一般分成三个部分，HTML、JS和控制器。HTML是显示所要新增的内容；JS是控制新增内容的显示和隐藏；控制器部分才是新增内容的核心，数据实质的新增全部过程都是在控制器完成·，HEML和JS只是为了在页面显示新增的过程。在这里HTMLL部分的布局简单讲讲，主要分析一下JS和控制器的过程。

HTML部分

HTML部分的布局用的是bootstrap4插件中的模态框，要注意的是需要新增的内容最好放在一个form表单里面。现在要新增的信息是学院信息，一个是学院名称，一个是学院的代号，都是可写的，每条信息内容用一个input标签存放即可。样式如下图所示，关闭的方法模态框自带，不需要写。

JS部分

JS部分又分为两步：1、打开新增的模态框；2、保存新增内容

第一步：打开新增的模态框；

打开新增的模态框就是点击新增按钮，然后把刚刚写好的模态框显示出页面。不过在显示之前要进行一些必要的操作，比如清空输入框的内容，这就是为什么在一开始布局的时候把新增的建议把新增的内容放在一个form表单里面的原因，这样就可以直接把表单的内容直接全部清空不用一个个的处理。清空表单的用意在于如果不清空，下次打开的时候会残留上一次的新增的数据。在这个项目中就是清空表单后就把模态框打开就可以了，其他项目还有可能还有其他的操作，例如有下拉框的情况打开之前就要进行下拉框数据的绑定。

第二步：保存新增内容；

保存的第一步就是要获取到新增的内容，如果新增内容都不知道就没有接下来新增的事情了，获取时可以根据input的Id值获取也可以根据name值获取。

    不管什么时候，获取到了变量之后就要对变量进行判断，判断是否获取到数据。这样进行数据判断不仅可以在异常时获取不到值时能更好的排除错误，而且能在用户漏填数据时有个提示，让用户把信息填写完整

可以直接在if条件里判断是否为空或者undefined，也可以像这样写一个方法来判断strValIsNotNull就是自己写的一个判断字符串是否为空的方法。

判断无误之后打开加载层，接着请求数据。加载层用的也是layui插件里面的内容，打开加载层后页面上鼠标无法点击到任何东西，使用加载层是为了防止在数据请求的过程中出现网络延迟，出现多次误点的情况，导致数据赘余。在请求前打开了加载层后必须在请求完成时把加载层关闭，否则加载层会一直执行。

       请求数据用post请求，post请求写法：post(“url”,{参数},回调函数);

第一个参数：请求控制器的路径

第二个参数：传参，用键值对的形式。键(“：”前面的单词)要和控制器的接收值一致，值(“：”后面的单词)要与js的获取变量时声明的值一致。

第三个参数：回调函数，请求完成后要执行的内容，加载层就要在这关闭。

    接着就要编写控制器部分的内容了，回调函数写完控制器的方法再回来写。

控制器部分

       接收可直接用需要新增的表接收，方法里面第一步要做的就是声明几个变量，一般两个，一个字符串类型的，用于记录需要返回页面的字符串；还有一个是布尔类型的，用于记录代码运行的状态。一般新增需要返回的就是这两个内容，可以直接在一开始就把返回写好，能避免报错。返回的写法如下所示，如果只有一个变量返回页面就不用new和{}，直接把变量写上就好，如果有多个变量就像下面写法一样用英文状态下的逗号隔开，有多少个可以写多少个。

    然后要进行二次检验，判断数据是否完整（JS判断一次，控制器判断一次）。判断第二次是为了数据准确性。IsNullOrEmpty()为控制器判断字符串是否为空的方法。如果出现不成了的情况，就设置一下返回的字符和把状态设置为false;

 

数据完整性的判断通过后，就要与数据库的数据进行对比，判断新增的数据是否和数据库1以前已有的数据重复。一般根据一些独特的信息进行比较，例如身份证号、某些编号、代号之类的。这里的例子是新增学院，要新增的学院名称和学院的代号都不能相同，所以需要两个信息都不能相同才能新增，换而言知只要学院名称或学院代号中的一条与数据库中的相同就意味着该学院信息已在数据库存在。

    同样的需要判断一下，查询重复数据时查询重复数据的条数，条数为0时说明不重复，判断到不等于0时则说明重复了，此时和判断数据完整性的时候一样设置需要返回的字符串以及把状态改为false。

    比较信息重复的判断通过后，新增前的准备工作就都做好，就可以开始新增了。其实新增非常简单，就是一句代码就可以把数据新增好，前面写了这么多全部都是为了保证新增的数据的准确性以及完整性。

    myModel.SaveChanges()获取到的值是数据库改变受影响的条数，新增完成之后要对其进行判断，如果大于0说明新增成功了，否则新增失败。分别设置返回页面的字符和状态，特别要注意的是当新增成功时要把状态改成true。接着就是一开始已经写好的返回，然后控制器的代码就圆满结束了，但是别忘了JS那边还有一段代码未完成。

    回调函数部分

就是请求完成后的一些操作，比如新增是否成功，判断控制器传回来的状态值。然后提示用户新增是否成功，输出返回的字符。成功了就要刷新一下表格和关闭模态框。