需求:我需要给后台提交一个集合,
前端:一个搜索框,用的form表单,几个复选框,想要把选中的所有复选框和搜索框中输入的值一并提交到后台,
问题:可能是我不知道如何用form表单提交复选框,所以我不知道如何一并提交
办法;在js文件中定义一个集合,存放搜索框和选中的复选框。然后进行提交。
最后在js中定义了一个集合,然后把搜索框input中的值和复选框的值放进集合里边一起提交到后台,
这个是wxml代码:
<view style="margin-top:260rpx;">
<form bindsubmit="formSubmit_phone" >
<view style="width:{{windowWidth}}px;" class="container-hang">
<text style="color:#c9c9c9;margin-left:90rpx;font-size:40rpx">国家/地区 </text>
<text style="color:#000;width:100%;margin-left:250rpx;font-size:40rpx">中国</text>
</view>
<view class="container-hang" style="width:{{windowWidth}}px;">
<input auto-focus="true" maxlength="11" type="number" style="font-size:50rpx;margin-top:30rpx" class="fidpas_inp" placeholder-class="lgin_place" placeholder="请输入手机号"name="phonenumber" />
</view>
<button disabled="{{disabled_code}}" class="{{sendmsg}}" bindtap="sendmessg" form-type='submit'>{{getmsg}}</button>
</form>
{{inputvalue}}
<form bindsubmit="formSubmit_code">
<input style="font-size:50rpx" bindinput="eng" type="number" class="fidpas_inp2" placeholder-class="lgin_place" placeholder="请输入短信验证码" maxlength="6" name="code" />
<button disabled="{{button_nextstep_disabled}}" type="{{button_nextstep_type}}" style="width:{{nextButtonWidth}}px;margin-top:100rpx" form-type="submit">下一步</button>
</form>
</view>
这个是js代码
var timer=1;
var phonelength;
Page({
data: {
inputvalue:'',
button_nextstep_type:'primary',//这个指:button ---下一步的type属性
button_nextstep_disabled: 'false',//这个指:button ---下一步的disabled属性
disabled_code:false,//这个指button——获取验证码的disabled属性
windowWidth: 0,//这个指屏幕的宽度
windowHeight: 0,
nextButtonWidth: 0,
sendmsg: "sendmsgg", //这个指button——获取验证码的class属性
getmsg: "获取短信验证码", //这个指button——获取验证码的显示的文字
},
/**
* 获取短信验证码
*/
onLoad: function () { //加载页面的时候操作。
var that = this
wx.getSystemInfo({
success: function (res) { //获取用户的手机的型号的信息,
that.setData({
windowWidth: res.windowWidth,
windowHeight: res.windowHeight,
nextButtonWidth: res.windowWidth - 20
})
}
})
},
formSubmit_phone:function(e){
phonelength = e.detail.value.phonenumber.length
if (phonelength!=1){ //这儿的判断格式应该还可以更加全面一些。
wx.showToast({
title: '格式错误',
icon:'loading'
})
}else{
this.setData({
disabled_code:true
})
if (timer == 1) {
timer = 0
var that = this
var time = 10
that.setData({
sendmsg: "sendmsgafter",
})
var inter = setInterval(function () {
that.setData({
getmsg: time + "s后重新发送",
})
time--
if (time < 0) {
timer = 1
clearInterval(inter)
that.setData({
sendmsg: "sendmsgg",
getmsg: "获取短信验证码",
disabled_code:false,
})
}
}, 1000)
}
}
console.log(e.detail.value.phonenumber)//-----------------这儿可以接受到输入的手机号码,然后根据接收到的手机号码获取验证码
},
formSubmit_code:function(e){//---------------------------这儿可以接收到验证码.和获取到的验证码进行比较判断
console.log(e.detail.value.code)
wx.switchTab({
url: '../index/index',
})
},
eng:function(e){
if (e.detail.value.length == 6 &&phonelength==1){
this.setData({
button_nextstep_disabled:false
})
}
}
})