Form pit summary

  • Use layui.form.val (“”) for the form value
  • Layui.form. render(“select”) is required to render the select box
  • To trigger form validation, lay-submit should be added to the dom of the submit button, and the == button and the form should be under the same layui-Form tag ==

Form validation

Layui existing verification type

  • Required (Mandatory)
  • Phone number
  • Email address
  • Url (Web address)
  • Number = number
  • Date (date)
  • My Identity

To use it, run the following command: lay-verify

<input name="operatorId" lay-verify="required" class="layui-input" type="text">
Copy the code

User-defined verification rules

form.verify({
  username: function(value, item){ //value: the form value, item: the DOM object of the form
    if(!new RegExp("^ [a zA - Z0-9 _ \ u4e00 - \ u9fa5 \ \ s.] + $").test(value)){
      return 'User names cannot have special characters'; }}// We support both the above functional approach and the following array form
  // The two values of the array represent: [regex match]
  ,pass: [
    / ^ [\ S] {12} $/
    ,'Password must be 6 to 12 characters without Spaces']});Copy the code

Add a form submission trigger to the popbox

layer.open({
		type : 1.title : 'Add role'.area : [ '500px'.'350px'].shadeClose : true.// Click mask to close
		content : html,
		btn : [ 'save'.'cancel'].success : function(layero, index) { // Callback after successful eject
			// Solve the problem of repeated pop-ups by pressing Enter
			$(':focus').blur();
			// Add the form identifier
			layero.addClass('layui-form');
			// Change the save button to the submit button
			layero.find('.layui-layer-btn0').attr({
				'lay-filter' : 'addRole'.'lay-submit' : ' '
			});
			// Form validation
			form.verify({
				roleName : function(value, item) {
					if (!new RegExp("^ [a - zA - Z0-9 _ | \ u4e00 - \ u9fa5 \] {2, 10} $")
							.test(value)) {
						return 'Role name must be 2-10 characters and no special characters'; }},roleDesc : function(value, item) {
					if (!new RegExp("^ [a - zA - Z0-9 _ \ u4e00 - \ u9fa5 \] {2200} $")
							.test(value)) {
						return 'Character description must be 2-200 characters with no special characters'; }}});// Refresh render (otherwise switch button will not show)
			form.render('checkbox');
		},
		yes : function(index, layero) { // Verify the button callback function
		layui.form.on('submit(formSubmit)'.function(data) {
                    // Verify data
                    _DNA.addData(_DNA.getAddData());
                });
		},
		btn2 : function(index, layero) { // Cancel the button callback function
			layer.close(index); // Close the pop-up layer}});Copy the code