如何获取复选框的值

开发工具与关键技术:Visual Studio、MVC
作者:幻奏
撰写时间:2019.6.7

我们在很多地方都用到了复选框,数据表格里也有复选框,新增数据时也可能要复选框,修改时也要回填复选框,所以我们用到的地方挺多的。
复选框我们都知道,它的样子就是一个小正方形,然后可以在里面打钩。
在这里插入图片描述
在这里插入图片描述
没错,它就是这个样子的。我平常给它的类型一般都是bit,如果是true那么它就是打钩了,如果它是false那么它就是没打钩的。
那么,我们该如何知道它是打勾还是不打勾呢,这时候我们就要获取复选框的值了。
我们可以判断它是否选中,选中了就返回什么,不选中返回什么。
在这里插入图片描述
如图:我写了一个方法,如果复选框被选中了,就在控制台返回1,没有选中就返回0,这样子就可以返回你们要的值了。
由于我要写新增,所以我要获取复选框的值,获取它是true或者是false,然后把数据传到控制器那里再新增。
我们在视图写保存新增的时候,第一步就是要获取它是否选中。
在这里插入图片描述
我们是根据form表单里,它的name值来获取的,平常我们是这样写的。
在这里插入图片描述
获取它的复选框时,我们要把后面的.val();改成.prop(‘checked’);
这样它就会返回true或者false。
我们获取到它的值之后,就要用post请求控制器那边保存新增的方法,
然后再把数据一个一个地传过去。
注意:传过去的名字要和那张表里的字段一样。

$.post("/KeHuGuanXi/KeHuGuanXi/InsertAgreement", {
                    UnitsName: unitsName,
                    Contacts: contacts,
                    Phone: phone,
                    AgreementNumber: agreementNumber,
                    PactSortID: pactSortID,
                    OnCredit: onCredit,
                    EmployeeID: employeeID
                }, function (returnJson) {
                    layer.close(layerIndex);//关闭加载层
                    if (returnJson.State == true) {
                        //刷新table
                        tabAgreemenType.reload();
                        //关闭模态框
                        $("#modalAgreement").modal("hide");
                    }
                    layer.alert(returnJson.Text);
                });

对了,我们一定要记住判断是否写完整了,要是没写完整就提示一下。(这里我没有写)
控制器那边就像平常那样写保存新增。

public ActionResult InsertAgreement(PW_Agreement pwAgreement)
        {
            ReturnJson returnJson = new ReturnJson();

            try
            {
                int listAgreement = (from tbAgreement in myModel.PW_Agreement
                                     where tbAgreement.AgreementNumber == pwAgreement.AgreementNumber
                                     || tbAgreement.UnitsName == pwAgreement.UnitsName
                                     || tbAgreement.Contacts == pwAgreement.Contacts
                                     || tbAgreement.Phone == pwAgreement.Phone
                                     select tbAgreement).Count();
                if (listAgreement == 0)
                {
                    myModel.PW_Agreement.Add(pwAgreement);
                    if (myModel.SaveChanges() > 0)
                    {
                        //新增用户表
                        PW_MarkBill pwMarkBill = new PW_MarkBill();
                        pwMarkBill.AgreementID = pwAgreement.AgreementID;
                        pwMarkBill.MarkBillMoney = 0;
                        myModel.PW_MarkBill.Add(pwMarkBill);
                        if (myModel.SaveChanges() > 0)
                        {
                            returnJson.State = true;
                            returnJson.Text = "新增成功!";
                        }
                        else
                        {
                            returnJson.Text = "新增失败!";
                        }
                    }
                    else
                    {
                        returnJson.Text = "新增失败!";
                    }
                }
                else
                {
                    returnJson.Text = "数据重复!";
                }

            }
            catch (Exception e)
            {
                Console.Write(e);
                returnJson.Text = "数据异常";
            }
            return Json(returnJson, JsonRequestBehavior.AllowGet);
        }

在下面我们要用linq查询出它是否和数据库有重复的数据,有就返回提示,没有就新增数据,然后保存。
然后return返回数据。

新增这样子就写完了。
那么,我们还有一个问题,如何在layui的数据表格上显示它的复选框呢?
在这里插入图片描述
很简单,我们只要像往常一样查询出数据加载数据表格,然后再写layui加载数据表格的方法,我们把要显示复选框的内容换一下就可以了。
如果我们不换的话,那么它显示出了的就是true或者false。
在这里插入图片描述
我们查询出数据了之后,要写一个方法,如果传来的数据是true,那么就给它一个已经打勾了的复选框,反之就给它一个没有打勾的复选框。
在这里插入图片描述
然后我们把这个方法放到layui的数据表格中。
在这里插入图片描述
这样就可以了,嘿嘿,是不是学会了呢。

  • 7
    点赞
  • 17
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值