小程序✨表单提交

---

1.先上代码

wxml

  <view wx:for="{{contentlistn}}">

    <form bindsubmit="loginFormData">
      <input label="id" name='id' value="{{item.id}}" hide="true" hidden="true"/>
      <l-input label="姓名" name='name' bindinput="names" type="text" placeholder="请输入姓名" value="{{item.name}}" />
      <l-input label="性别" name='sex' type="text" placeholder="请输入性别" wx:if="{{item.sex==1}}" value="男" />
      <l-input label="性别" name='sex' type="text" placeholder="请输入性别" wx:if="{{item.sex==2}}" value="女" />
      <l-input label="生日" name='birthday' type="text" placeholder="请输入生日" value="{{item.birthday}}" />
      <l-input label="电话号码" name='phone' type="text" placeholder="请输入电话号码" value="{{item.phone}}" />
      <l-input label="身高" name='height' type="text" placeholder="请输入身高" value="{{item.height}}" />
      <l-input label="体重" name='weight' type="text" placeholder="请输入体重" value="{{item.weight}}" />
      <l-input label="所属行业" name='industry' type="text" placeholder="请输入所属行业" value="{{item.industry}}" />
      <l-input label="微信号" name='wechat' type="text" placeholder="请输入微信号" value="{{item.wechat}}" />
      <l-input label="所在地区" name='regionalism' type="text" placeholder="请输入所在地区" value="{{item.regionalism}}" />
      <l-input label="详细地址" name='address' type="text" placeholder="请输入详细地址" value="{{item.address}}" />
      <text>\n</text>
      <button plain type="primary" form-type="submit">保存</button>
    </form>
  </view>

js

  /**登录按钮submit提交 */
  loginFormData: function (e) {
    var formData = e.detail.value; //获取表单数据
    console.log("表单提交的数据", formData)
    //调用接口，提交更改
    wx.request({
      //这里的url用的是新视觉实训的一个测试接口
      url: config.api_base_url + 'member/ltMember/edit',
      method: 'POST',
      data: formData,
      header: {
        'content-type': 'application/json' // 默认值
      },
      //success是接口调用成功的回调函数,这里习惯用res去接收返回值
      success: res => {
        console.log("表单提交数据库返回值", res)
        if (res.data.code == 200) {
          wx.redirectTo({
            url: '../mine/index',
          })
        }
      },
      fail: function (res) {
        console.log('调用失败', res)
      }
    })
  }

form层 bindsubmit="loginFormData"
提交按钮form-type="submit"

最终效果