表单验证Validform

Posted 2020-06-13

<script type="text/javascript" src="/js/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="/js/Validform_v5.2.1.js"></script>
<script type="text/javascript" src="/js/city.js"></script>

<form action="/finance/release" method="post" id="myform" name="myform">
        <div class="release_cont">
          <label>发起人姓名：</label>
          <input type="text" class="release_text" id="name" name="name" datatype="name" nullmsg="请填写发起人姓名!" />
          <span class="Validform_checktip"></span>
        </div>
        <div class="release_cont">
          <label>手机号码：</label>
          <input type="text" class="release_text" id="mobile" name="mobile" value="" style="border: 0" readonly="true"/>
        </div>
        <div class="release_cont">
          <label>项目名称：</label>
          <input type="text" class="release_text" id="itemName" name="itemName" datatype="itemName" nullmsg="请填写项目名称!" />
          <span class="Validform_checktip"></span>
        </div>
        <div class="release_cont">
          <label>所属地区：</label>
              <input type="hidden" id="area" name="area" />
              <input type="hidden" id="city" name="city" />
            <select name="areaCode" id="areaCode" onChange="selectcityarea(‘areaCode‘,‘cityCode‘,‘myform‘);document.getElementById(‘area‘).value=this.options[this.selectedIndex].text">
              <option selected="selected" value="0">--请选择城市</option>
            </select>
          
            <select name="cityCode" id="cityCode" onChange="document.getElementById(‘city‘).value=this.options[this.selectedIndex].text" datatype="city" nullmsg="请填写所在地区!" style="margin-left:20px;">
              <option selected="selected" value="0">--请选择地区</option>
            </select>
            
              <script language="javascript">
                first("areaCode","cityCode","myform",0,0);
              </script>
              <span class="Validform_checktip"></span>
        </div>
        <div class="release_cont">
          <label>筹资金额：</label>
          <input type="text" class="release_text" id="money" name="money" datatype="money" nullmsg="请填写筹资金额!" errormsg="请填写数字!"/>
          <span class="Validform_checktip"></span>
        </div>
        <div class="release_cont">
          <label>出让股份：</label>
          <input type="text" class="release_text" id="sellShares" name="sellShares" datatype="sellShares" nullmsg="请填写出让股份!" />
          <span class="Validform_checktip"></span>
        </div>
        <div class="release_cont">
          <label>项目介绍：</label>
          <textarea cols="45" rows="10" id="itemInfo" name="itemInfo" datatype="itemInfo" nullmsg="请填写项目介绍!" ></textarea>
          <span class="Validform_checktip"></span>
        </div>
        <div class="release_cont">
          <label>验证码：</label>
          <input type="text" class="input-text input-long-m" style="width:133px; height:43px; margin-right:15px;" 
          size="10" id="securityCode" name="securityCode" datatype="securityCode" nullmsg="请填写验证码!" />
          <div class="psd_main_code" style="display:inline-block;">
              <a href="../forgetPwd/verifycode.html" target="verifyFrame">
                 <iframe id="verifyFrame" name="verifyFrame" frameborder="no" scrolling="no" width="80" height="40" style="border:0 none; vertical-align:middle; overflow:hidden;"
                               src="../forgetPwd/verifycode.html?type=release"></iframe>
              </a>
              <a href="../forgetPwd/verifycode.html?type=release" target="verifyFrame" id="changeVerifyCode">
                    &nbsp;换一张
              </a>
          </div>
          <span class="Validform_checktip"></span>
        </div>
        
        <div class="release_cont">
          <div class="release_btnok" id="add">提交</div>
        </div>
      </div>
</form>

$(document).ready(function(){
    $("#myform").Validform({
        btnSubmit:"#add", 
        tiptype:function(msg,o,cssctl){
             if(!o.obj.is("form")){
                var objtip=o.obj.parents().children(".Validform_checktip");
                cssctl(objtip,o.type);
                objtip.text(msg);
            }
        },
        ajaxPost : true,
        datatype:{
            "name" : function(gets,obj,curform,regxp){
                if(gets == ‘‘){
                    return "请填写发起人姓名!";
                }
                return true;
            },
            "itemName" : function(gets,obj,curform,regxp){
                if(gets == ‘‘){
                    return "请填写项目名称!";
                }
                return true;
            },
            "city" : function(gets,obj,curform,regxp){
                if(gets == 0){
                    return "请填写所在地区!";
                }
                return true;
            },
            "money" : function(gets,obj,curform,regxp){
                if(gets == ‘‘){
                    return "请填写筹资金额!";
                }
                return true;
            },
            "sellShares" : function(gets,obj,curform,regxp){
                if(gets == ‘‘){
                    return "请填写出让股份!";
                }
                return true;
            },
            "itemInfo" : function(gets,obj,curform,regxp){
                if(gets == ‘‘){
                    return "请填写项目介绍!";
                }
                return true;
            },
            "securityCode" : function(gets,obj,curform,regxp){
                var flag = "";
                if(gets == ‘‘){
                    return "请填写验证码!";
                }else{
                    $.ajax({
                        type:"get",
                        url:"/verifycode/check/release/" + gets,
                        async : false,
                        success:function(data){
                            if(data.message == "wrong"){
                                flag = "请输入正确的验证码!";
                            }
                        }
                    })
                }
                if(flag != ""){
                    return flag;
                }
                return true;
            }
        },
        callback : function(data) {
            if(data == 0){
                $("#message").html("提交成功！点击返回。");
            } else {
                $("#message").html("提交失败！点击返回。");
            }
        }
    });
});

validform官网：　　 http://validform.rjboy.cn/