表单设计

不用写代码生成表单,可以自行设计表单模板实


表单设计概述

  • 支持自定义模板。表单编辑和查看页面共用同一个模板。

  • 完全不用考虑数据库是怎样操作的,所有都是保存表单设计后自动完成的,您只需要配置表单字段。

  • 如“人事档案”表单,表单设计完成后得到四个功能页面,新建人事档案、编辑人事档案、查看人事档案、删除人事档案。

表单实例演示

文章发布页面
新建客户页面
新建产品页面
新建销售订单页面

表单设计首页面

Formweaver表单设计_英文

点击右键可以表单预览,设计表单模板(编写简单的HTML),编辑表单,删除表单。

新建表单页面

Formweaver表单设计_数据库_02

新建表单字段页面

Formweaver表单设计_required_03

字段描述是字段的中文名称,字段名称会作为数据库字段,必填,且必须为英文。

字段类型有:单行文本框、多行文本框、下拉菜单、单选框、复选框、附件、列表。

选项配合字段类型使用,下拉菜单、单选框、复选框类型时候,选项形如“选项一,选项二,选项三”。附件类型时候,选项中填写允许上传的附件类型,形如“jpg|gif|png”,选项为空则不限制上传附件类型。 列表类型时候,选项中填写列表名称,列表名称请从列表设计里选取。

验证规则对表单字段进行验证,所有表单字段通过验证后才能保持表单。例如:“required”,该字段为必填项。验证规则可以多个,例如:“required|integer”,该字段为必填且必须为整数。更多 验证规则参考手册

其他中填写字段的标签属性,如: style="width:200px;",最终在表单页面生成的代码为<input name="input" style="width:200px;" >

设计表单模板

Formweaver表单设计_数据库_04

设计表单模板,不要出现 form、body标签,系统会自动把"#[字段中文名称]"替换为设计好的字段。

表单验证规则

规则参数描述举例
requiredNo必填,不能为空 
matchesYes如果表单元素的值与参数中对应的表单字段的值不相等,则返回FALSEmatches[form_item]
is_uniqueYes返回FALSE,如果表单元素并不是唯一的参数表和字段的名称。is_unique[table.field]
min_lengthYes如果表单元素值的字符长度少于参数中定义的数字,则返回FALSEmin_length[6]
max_lengthYes如果表单元素值的字符长度大于参数中定义的数字,则返回FALSEmax_length[12]
exact_lengthYes如果表单元素值的字符长度与参数中定义的数字不符,则返回FALSEexact_length[8]
greater_thanYes返回FALSE如果表单元素小于参数值的数值。greater_than[8]
less_thanYes返回FALSE,如果表单元素大于参数值数值。less_than[8]
alphaNo如果表单元素值中包含除字母以外的其他字符,则返回FALSE 
alpha_numericNo如果表单元素值中包含除字母和数字以外的其他字符,则返回FALSE 
alpha_dashNo如果表单元素值中包含除字母/数字/下划线/破折号以外的其他字符,则返回FALSE 
numericNo如果表单元素值中包含除数字以外的字符,则返回 FALSE 
integerNo如果表单元素中包含除整数以外的字符,则返回FALSE 
decimalYes返回FALSE,如果表单元素并不是参数值。 
is_naturalNo如果表单元素值中包含了非自然数的其他数值 (其他数值不包括零),则返回FALSE。自然数形如:0,1,2,3....等等。 
is_natural_no_zeroNo如果表单元素值包含了非自然数的其他数值 (其他数值包括零),则返回FALSE。非零的自然数:1,2,3.....等等。 
valid_emailNo如果表单元素值包含不合法的email地址,则返回FALSE 
valid_emailsNo如果表单元素值中任何一个值包含不合法的email地址(地址之间用英文逗号分割),则返回FALSE。 
valid_ipNo如果表单元素的值不是一个合法的IP地址,则返回FALSE。 
valid_base64No如果表单元素的值包含除了base64 编码字符之外的其他字符,则返回FALSE。

弹出选择数据窗口JS函数

data_picker()是一个系统内置的JS函数,用于弹出小窗口选择数据。
参数说明:data_picker(title,vid,fields,items,width,height,template);

  • 第一个参数:弹出窗口标题

  • 第二个参数:选择列表页面ID

  • 第三个参数:需要自动填入表单的字段数组,形如:['chanpinid','chanpinmc','danjia']

  • 第四个参数:被选择列表的列序号数组,与第三个字段一一对应,形如[0,2,5]

  • 第五个参数:弹出窗口宽度,可不填,默认自动宽度。

  • 第六个参数:弹出窗口高度,可不填,默认自动高度。

  • 第七个参数:弹出列表应用模板,可不填。

例如订单明细中产品字段“其他”中加入readonly onclick="data_picker('选择产品','111',['chanpinid','chanpinmc','danjia'],[0,2,5]);"
“readonly”意为本字段不可写,“onclick”意为点击时弹出选择数据窗口。弹出列表中的1,3,6列内容自动分别填入到表单中字段名称为'chanpinid','chanpinmc','danjia'值中,并关闭该窗口。
以下给出该函数定义方法,可以看出并不复杂。您当然也可以在表单模板设计中加入自定义的JS函数和CSS样式。

var url=location.href.replace(location.search,'');function data_picker(title,vid,fields,items,width,height,template){	if(!template){template="select";}	if(!width){width="auto";}	if(!height){height="auto";}	$.ajax({	url: url+'?c=general&m=listview&vid='+vid+'&template='+template,	success: function(c){			$("#dialog").html("");			var d=$("#dialog" ).append(c).dialog({title:title, width:width,height:height,modal: true });			$(document).on('click','#dialog tbody tr',function(){				for(var x in fields){ 					ob(fields[x]).val($(this).find("td").eq(items[x]).html());				}				d.dialog("close"); 			});	}	});}