zoukankan      html  css  js  c++  java
  • .net core mvc中input保留多位小数

    本篇介绍:如何在mvc中使用html标签保留多位小数

    你需要知道:

    @html标签的使用: https://blog.csdn.net/pasic/article/details/7093802

    js正则参考:https://blog.csdn.net/xinghuo0007/article/details/72675105

    前端:Layui

    ①创建页面  Shared创建文件夹EditorTemplates(必须的,自定义都需要放到此目录下) ,然后添加Razor视图,命名为Number

     具体代码如下:

    @using System.ComponentModel.DataAnnotations;
    @using System.Reflection;
    @{
        //Html.DisplayNameForModel(): [Display(Name = "xx")]
        //ViewData.TemplateInfo.HtmlFieldPrefix: @Html.EditorFor(model => model.DJ, new { Fixed = 2 })
    
        //保留的小数 传递的参数
        int Fixed = ViewData["Fixed"] == null ? 2 : (int)ViewData["Fixed"];
        //是否非空
        bool readOnly = false;
        readOnly = ViewData["readOnly"] == null ? false : (bool)ViewData["readOnly"];
        string dataRequired = "";
        string keyUp = "";
        try
        {
            var Field = ViewData.ModelMetadata.ContainerType.GetProperty(ViewData.TemplateInfo.HtmlFieldPrefix);
            RequiredAttribute required = (RequiredAttribute)Field.GetCustomAttribute(typeof(RequiredAttribute), false);
            if (required != null)
            {
                dataRequired = "data-val=true data-val-required=" + Html.DisplayNameForModel() + "为必填字段  data-val-number=" + Html.DisplayNameForModel() + "必须是数字";
            }
            if (Fixed == 0) //整数
            {
                keyUp = @"this.value=this.value.replace(/D/gi,'')";
            }
            else if (Fixed == -1) //不计算小数位
            {
                keyUp = @"this.value=this.value.replace(/[^d.]/g,'').replace(/^./g,'').replace(/.{2,}/g,'.').replace('.','$#$').replace(/./g,'').replace('$#$','.')";
            }
            else
            {
                keyUp = @"this.value=this.value.replace(/[^d.]/g,'').replace(/^./g,'').replace(/.{2,}/g,'.').replace('.','$#$').replace(/./g,'').replace('$#$','.').replace(/^(-)*(d+).(d{" + Fixed + "}).*$/,'$1$2.$3')";
            }
        }
        catch { }
    }
    <input class="layui-input input-validation-error" type="text" @dataRequired @(readOnly ? "disabled" : "")
           id="@ViewData.TemplateInfo.HtmlFieldPrefix" name="@ViewData.TemplateInfo.HtmlFieldPrefix"
           aria-describedby="@ViewData.TemplateInfo.HtmlFieldPrefix-error"
           aria-invalid="true" onkeyup=@keyUp>
    View Code

     

    ②在ViewModel上面标注: UIHint("Number")

     ③页面使用:

    注:如果我们不想使用@html标签,我们也能使用js的

    添加js方法:

     layInputNumber: function (idForm) {
            var advDiv = $(idForm);
            var allInput = $("[data-options]", advDiv);
            for (var i = 0; i < allInput.length; i++) {
                let item = $(allInput[i]);
                if (item[0] != "") {
                    let op = item.data('options');
                    if (op.type == "Fixed") {
                        let Fixed = 2;//默认两位
                        if (op.Fixed) {
                            Fixed = op.Fixed;
                        }
                        let obj = item[0];
                        if (Fixed == 0) //整数
                        {
                            item[0].onkeyup = function (e) {
                                obj.value = obj.value.replace(/D/gi, '');
                            };
                        }
                        else if (Fixed == -1) //不计算小数位
                        {
                            item[0].onkeyup = function (e) {
                                obj.value = obj.value.replace(/[^d.]/g, ""); //清除"数字"和"."以外的字符
                                obj.value = obj.value.replace(/^./g, ""); //验证第一个字符是数字
                                obj.value = obj.value.replace(/.{2,}/g, "."); //只保留第一个, 清除多余的
                                obj.value = obj.value.replace(".", "$#$").replace(/./g, "").replace("$#$", ".");
                            };
                        }
                        else {
                            item[0].onkeyup = function (e) {
                                obj.value = obj.value.replace(/[^d.]/g, ""); //清除"数字"和"."以外的字符
                                obj.value = obj.value.replace(/^./g, ""); //验证第一个字符是数字
                                obj.value = obj.value.replace(/.{2,}/g, "."); //只保留第一个, 清除多余的
                                obj.value = obj.value.replace(".", "$#$").replace(/./g, "").replace("$#$", ".");
                                //参数不能使用字面量来添加,需要使用 new RegExp
                                var re = new RegExp("^(\-)*(\d+)\.(\d{" + Fixed + "}).*$");
                                obj.value = obj.value.replace(re, "$1$2.$3")
                                //obj.value = obj.value.replace(/^(-)*(d+).(d{n}).*$/, "$1$2.$3");     //能输入两个小数
                            }
                        }
                    }
                }
            }
    View Code
     <div class="layui-input-block">
      @*利用data-options传递自定义参数,这个是跟js对应的*@
      <input name="HL" id="HL" class="layui-input" lay-verify="required|number" data-options='{"type":"Fixed","Fixed":3}' />
    </div>

     使用:

     

  • 相关阅读:
    ACM的算法分类 2015-04-16 14:25 22人阅读 评论(0) 收藏
    初学Larevel 2014-08-21 11:24 90人阅读 评论(0) 收藏
    初学PHP&MySQL 2014-05-31 12:40 92人阅读 评论(0) 收藏
    codeforces 570 E. Pig and Palindromes (dp)
    codeforces 570 D. Tree Requests (dfs序)
    poj 2157 Maze (bfs)
    cf 570 C. Replacement (暴力)
    cf 570B B. Simple Game(构造)
    cf 570 A. Elections
    hdu 1429胜利大逃亡(续) (bfs+状态压缩)
  • 原文地址:https://www.cnblogs.com/Sea1ee/p/11382111.html
Copyright © 2011-2022 走看看