uniappform表单提交,数据格式验证
uniapp form表单提交,数据格式验证
前端页⾯
<view class="container">
<form @submit="formSubmit" @reset="formReset">
<uni-collapse>
<uni-collapse-item title="患者基本信息" open="true">
<view class="line">
<label >姓名:</label>
<input name="name" class="chat_input" type="text" placeholder="请正确填写姓名..."/>
</view>
<view class="line">
<view >性别:</view>
<view>
<radio-group name="gender">
<label class="radio">
<radio value="男" />男
</label>
<label class="radio" >
<radio value="⼥" />⼥
</label>
</radio-group>
</view>
</view>
<view class="line">
<label >出⽣⽇期:</label>
<input name="birth" class="chat_input" type="text" placeholder="格式:2020-01-01(选填)"/>
</view>
<view class="line">
<label >患者电话:</label>
<input name="tel" class="chat_input" type="text" placeholder="请填写患者或家属⼿机号"/>
</view>
</uni-collapse-item>
<uni-collapse-item title="检查信息" open="true">
<view class="line">
<label >初步诊断:</label>
<input name="diagnose" class="chat_input" type="text" placeholder="选填"/>
</view>
<view class="line">
<label >检查项⽬:</label>
<input name="item" class="chat_input" type="text" placeholder="请填写检查、检查部位"/>
</view>
</uni-collapse-item>
</uni-collapse>
<view >
<myBtn type="submit" w_size="600" h_size="80" text="提交预约"></myBtn>
</view>
</form>
</view>
JS
methods: {
formSubmit:function(e){
let tmp = JSON.stringify(e.detail.value)
console.log('form发⽣了submit事件,携带数据为:' + JSON.stringify(e.detail.value))
var formdata = e.detail.value
// 数据校验
// console.log(formdata.birth);
json检查//正则表达式
let reg_name = /^[\u4e00-\u9fa5]{0,}$/
let reg_birth = /^(?:(?!0000)[0-9]{4}-(?:(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-8])|(?:0[13-9]|1[0-2])-(?:29|30)|(?:0[13578]|1[02])-31)|(?:[0-9]{2}(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)-02-29)$/; let reg_tel = /(\d{11})|^((\d{7,8})|(\d{4}|\d{3})-(\d{7,8})|(\d{4}|\d{3})-(\d{7,8})-(\d{4}|\d{3}|\d{2}|\d{1})|(\d{7,8})-(\d{4}|\d{3}|\d{2}|\d{1}))$/
//结果标记
let sign_name = RegExp(reg_name).test(formdata.name);
let sign_birth = RegExp(reg_birth).test(formdata.birth);
let sign_tel = RegExp(reg_tel).l);
// console.log(sign+",数据类型:"+typeof(sign));
if(!sign_name||formdata.name==''){
this.showModal('请检查姓名');
}else der==''){
this.showModal('请选择性别')
}else if(!sign_birth||formdata.name==''){
this.showModal("请检查出⽣⽇期");
}else if(!sign_tel||formdata.name==''){
this.showModal("请检查电话号码");
}else if(formdata.diagnose==''){
this.showModal('请填写初步诊断')
}else if(formdata.item==''){
this.showModal("请填写检查部位");
}else{
url: this.$baseUrl.baseUrl+"Wxtest/ApplyCheck",
data: tmp,
method: "post",
success:(res)=> {
this.showModal(res.data.msg);
if (firm||res.cancel) {
console.log('⽤户点击确定');
}
},
fail:(res)=>{
console.log("错误")
}
})
}
},
formReset: function(e) {
console.log('清空数据')
},
showModal:function(content){
uni.showModal({
title:'提⽰',
content:content,
})
},
}
C#后端处理⽅法
public string ApplyCheck()
{
string name = GetRequestString("name", Request);
string gender = GetRequestString("gender", Request);
string birth = GetRequestString("birth", Request);
string tel = GetRequestString("tel", Request);
string diagnose = GetRequestString("diagnose", Request);
string item = GetRequestString("item", Request);
//创建随机数
Random ran = new Random();
string id = DateTime.Now.ToString("yyyyMMddHHmmss") + ran.Next(100,999);
//sql
string inser_t_check = @"insert into t_check (p_id,p_name,p_gender,p_birth,p_tel,p_diagnose,p_item) values ('{0}','{1}','{2}','{3}','{4}','{5}','{6}')"; inser_t_check = string.Format(inser_t_check,id, name, gender, birth, tel, diagnose, item);
//执⾏
OracleHelper.ExecuteNonQuerySQL(inser_t_check);
//
Dictionary<string, string> dic = new Dictionary<string, string>();
dic.Add("msg", "预约成功");
string response = JsonConvert.SerializeObject(dic);
return response;
}
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论