input.js 4.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155
  1. Component({
  2. data: {
  3. showTopTips: false,
  4. radioItems: [
  5. {name: 'cell standard', value: '0', checked: true},
  6. {name: 'cell standard', value: '1'}
  7. ],
  8. checkboxItems: [
  9. {name: 'standard is dealt for u.', value: '0', checked: true},
  10. {name: 'standard is dealicient for u.', value: '1'}
  11. ],
  12. items: [
  13. {name: 'USA', value: '美国'},
  14. {name: 'CHN', value: '中国', checked: 'true'},
  15. {name: 'BRA', value: '巴西'},
  16. {name: 'JPN', value: '日本'},
  17. {name: 'ENG', value: '英国'},
  18. {name: 'TUR', value: '法国'},
  19. ],
  20. date: "2016-09-01",
  21. time: "12:01",
  22. countryCodes: ["+86", "+80", "+84", "+87"],
  23. countryCodeIndex: 0,
  24. countries: ["中国", "美国", "英国"],
  25. countryIndex: 0,
  26. accounts: ["微信号", "QQ", "Email"],
  27. accountIndex: 0,
  28. isAgree: false,
  29. formData: {
  30. },
  31. rules: [{
  32. name: 'radio',
  33. rules: {required: true, message: '单选列表是必选项'},
  34. }, {
  35. name: 'checkbox',
  36. rules: {required: true, message: '多选列表是必选项'},
  37. }, {
  38. name: 'qq',
  39. rules: {required: true, message: 'qq必填'},
  40. }, {
  41. name: 'mobile',
  42. rules: [{required: true, message: 'mobile必填'}, {mobile: true, message: 'mobile格式不对'}],
  43. }, {
  44. name: 'vcode',
  45. rules: {required: true, message: '验证码必填'},
  46. }, {
  47. name: 'idcard',
  48. rules: {required: true, message: 'idcard必填'},
  49. }]
  50. },
  51. methods: {
  52. radioChange: function (e) {
  53. console.log('radio发生change事件,携带value值为:', e.detail.value);
  54. var radioItems = this.data.radioItems;
  55. for (var i = 0, len = radioItems.length; i < len; ++i) {
  56. radioItems[i].checked = radioItems[i].value == e.detail.value;
  57. }
  58. this.setData({
  59. radioItems: radioItems,
  60. [`formData.radio`]: e.detail.value
  61. });
  62. },
  63. checkboxChange: function (e) {
  64. console.log('checkbox发生change事件,携带value值为:', e.detail.value);
  65. var checkboxItems = this.data.checkboxItems, values = e.detail.value;
  66. for (var i = 0, lenI = checkboxItems.length; i < lenI; ++i) {
  67. checkboxItems[i].checked = false;
  68. for (var j = 0, lenJ = values.length; j < lenJ; ++j) {
  69. if(checkboxItems[i].value == values[j]){
  70. checkboxItems[i].checked = true;
  71. break;
  72. }
  73. }
  74. }
  75. this.setData({
  76. checkboxItems: checkboxItems,
  77. [`formData.checkbox`]: e.detail.value
  78. });
  79. },
  80. bindDateChange: function (e) {
  81. this.setData({
  82. date: e.detail.value,
  83. [`formData.date`]: e.detail.value
  84. })
  85. },
  86. formInputChange(e) {
  87. const {field} = e.currentTarget.dataset
  88. this.setData({
  89. [`formData.${field}`]: e.detail.value
  90. })
  91. },
  92. bindTimeChange: function (e) {
  93. this.setData({
  94. time: e.detail.value
  95. })
  96. },
  97. bindCountryCodeChange: function(e){
  98. console.log('picker country code 发生选择改变,携带值为', e.detail.value);
  99. this.setData({
  100. countryCodeIndex: e.detail.value
  101. })
  102. },
  103. bindCountryChange: function(e) {
  104. console.log('picker country 发生选择改变,携带值为', e.detail.value);
  105. this.setData({
  106. countryIndex: e.detail.value
  107. })
  108. },
  109. bindAccountChange: function(e) {
  110. console.log('picker account 发生选择改变,携带值为', e.detail.value);
  111. this.setData({
  112. accountIndex: e.detail.value
  113. })
  114. },
  115. bindAgreeChange: function (e) {
  116. this.setData({
  117. isAgree: !!e.detail.value.length
  118. });
  119. },
  120. submitForm() {
  121. this.selectComponent('#form').validate((valid, errors) => {
  122. console.log('valid', valid, errors)
  123. if (!valid) {
  124. const firstError = Object.keys(errors)
  125. if (firstError.length) {
  126. this.setData({
  127. error: errors[firstError[0]].message
  128. })
  129. }
  130. } else {
  131. wx.showToast({
  132. title: '校验通过'
  133. })
  134. }
  135. })
  136. }
  137. }
  138. });