js页面字段的必填验证方法

js页面头部引入<script language="javascript" src="../js/jquery.validate.js"></script>

<form action = "./PlanTaskAction.do" method="post" name="frmAdd" id="frmAdd" > 

 
        <div class="weui_cells_title">请添加计划信息!</div>
        <div class="weui_cells weui_cells_form">
            <div class="weui_cell">
                <div class="weui_cell_hd"><label class="weui_label">任务名称</label></div>
                <div class="weui_cell_bd weui_cell_primary">
                    <input name="taskname" id="taskname" type="text" class="weui_input required" maxlength="200" value="<%=Util.strNull(planTask.getTaskname())%>">
                </div>
            </div>
            
            
          <div class="weui_btn_area">
            <input type="submit"  class="buttonss" id="saveplantask"  value="保存 ">
        </div>
        <br>
        </div>
     
        </form>

点击保存按钮,先要对必填字段进行验证:

方法一:

<input type="submit"  class="buttonss" id="saveplantask" onClick="addTask();"  value="保存 ">

 $().ready(function() {  
      $("#frmAdd").validate( );  
    }); 

 function addTask(){
  frmAdd.action="./PlanTaskAction.do?doType=51";
  $("#frmAdd").submit(); 

}

方法二:

<input type="submit"  class="buttonss" id="saveplantask"  value="保存 ">

$().ready(function() {  
      $("#frmAdd").validate({  
          submitHandler:function(form){         
          addTask();         //验证必填成功后调用addTask()函数, 如果想提交表单, 需要使用form.submit()而不要使用$(form).submit()
          }      
      });  
    }); 

function addTask(){
  //frmAdd.action="./PlanTaskAction.do?doType=51";
  //frmAdd.submit();  //如果想提交表单, 需要使用form.submit()而不要使用$(form).submit()
  
   var datas = $('#frmAdd').serialize();  
        $.ajax({
type:"POST", 
dataType:"text", //text支持中文,json乱码
contentType: "application/x-www-form-urlencoded; charset=utf-8",
url:"./PlanTaskAction.do?doType=51",
data: encodeURI(datas),
cache: false, 
async: true, 
success:function(data){
if(data=="ok"){
alert("保存成功");
document.getElementById('saveplantask').style.display="none";
// parent.location.reload();
} else{
alert("保存失败"); 
}
},
error:function(e){
alert("保存失败"); 
}
});  
   } 

方法三:

$().ready(function() {

$("#frmAdd").validate();

});

$().ready(function() {  
$("#btadd").click(function(){
if($("#frmAdd").valid()){            
         save();         //验证必填成功后调用save()函数   
        }          
  }); 
});  

猜你喜欢

转载自blog.csdn.net/xinzi11243094/article/details/81482399
今日推荐