⼩程序:提交表单数据中选择的⽇期
如何将选中的⽇期通过表单提交
add.js
Page({
data:{
info:{
name:'',
phone:'',
createDate:''
},
},
onLoad(){
},
formSubmit(e){
const value = e.detail.value;
if(value.name && value.phone){
console.info(value);
//使⽤⼩程序的云开发添加数据,也可以使⽤其他的
wx.cloud.init()
const db = wx.cloud.database()
data:{
name:value.name,
phone:value.phone,
ateDate
},
success: res =>{
wx.showToast({
写文章的小程序title:'新增记录成功',
})
console.log('[数据库] [新增记录] 成功,记录 _id: ', res._id) },
fail: err =>{
wx.showToast({
icon:'none',
title:'新增记录失败'
})
<('[数据库] [新增记录] 失败:', err)
}
})
}else{
wx.showModal({
title:'提⽰',
content:'请填写完整资料',
showCancel:false
})
}
},
bindDateChange:function(e){
this.setData({
date: e.detail.value
})
}
})
add.wxml
<view class="main">
<view class="form-box">
<form bindsubmit="formSubmit">
<input value="{{info.name}}" name="name" placeholder="姓名"/>
<input type="number" name="phone" value="{{info.phone}}" placeholder="电话号码"/>
<picker mode="date" value="{{ateDate}}" start="2020-01-01" end="2089-01-01" bindchange="bindDateChange"> <view class="picker">
当前选择:{{date}}
<input name="createDate" id="{{ateDate}}" value="{{date}}"
/>
</view>
</picker>
<button form-type="submit">保存</button>
</form>
</view>
</view>
add.wxss
.form-box{
padding-left:30rpx;
}
.form-box input{
height:90rpx;
border-bottom:1rpx solid #ededed;
color: #999;
}
.form-box .input-placeholder{
color: #aaa;
}
.form-box button{
margin:30rpx 30rpx 00;
}
.form-box picker{
margin:30rpx 30rpx 00;
color: #999;
}
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论