当前位置: 首页 > Web前端 > JavaScript

Foxnic-Web代码生成(七)-配置表单页面

时间:2023-03-27 16:22:04 JavaScript

Foxnic-Web代码生成(七)-配置表单页面概览前面介绍了常用的字段配置和表单组件配置字段,这些配置仅限于单个场地。由于Foxnic-Web的模块页面以打开窗口的形式呈现表单内容,自然会有对表单窗口和表单域布局的控制。在这篇文章中,让我们看看在代码生成过程中我们可以在表单渲染方面做些什么。本文的示例代码可以在https://gitee.com/LeeFJ/foxni...项目中找到,本文结合webfull项目进行说明。完整示例Foxnic-Web项目提供了代码生成的完整示例,请参考:https://gitee.com/LeeFJ/foxni...配置表单窗口Form相关的配置可以在模块的configForm方法中实现代码配置类:@OverridepublicvoidconfigForm(ViewOptionsview,FormOptionsform,FormWindowOptionsformWindow){formWindow.width("120px");formWindow.bottomSpace(263);}配置窗体窗口,由ViewOptions.formWindow()选项控制。formWindow提供的控件项包括:配置项descriptionwidth设置窗体窗口的宽度,默认为500px;该字符串可以指定像素或百分比。bottomSpace设置底部表单组件与窗口底部的距离,用于提高表单窗口的高度,方便下拉框的显示。窗体窗口的高度会根据窗体中的实际内容自动调整,所以不需要指定窗体窗口的高度。在某些情况下,因为表单中的字段较少,窗口的高度会比较低。这时候如果输入框是下拉框,下拉选项可能显示不好,需要人为增加窗体窗口的高度。,那么你需要使用bottomSpace参数。配置表单依赖文件表单和表单页面通过FormOptions配置。生成代码时,表单页面可以额外包含其他js和css文件,以及变量等。配置项如下:配置项说明addCss添加css文件导入addJs添加js文件导入。addJsVariable添加一个js变量;这是表单的服务器端模板变量。配置表单外观参数表单外观参数如下:配置项描述labelWidth设置标签的宽度,单列默认为65px;多列的默认值为100pxdisableFooter禁用用于页面嵌入的页脚。disableMargin禁用页面嵌入的边距。enableContextMenu启用右键菜单,默认为false。配置表单布局Foxic-Web的表单布局比较丰富,支持分组和分栏;支持添加内嵌页面、标签等,相关配置项如下:配置项说明columnLayout使用列布局addGroup添加分组布局addPage添加内容内嵌页面addTab添加内嵌Tab配置表单界面Foxic-Web的表单布局比较丰富,支持分组,分栏;支持添加内嵌页面、Tabs等,相关配置项如下:配置项描述savingURL设置自定义保存接口地址loadingURL设置自定义数据加载接口地址从窗体窗口、窗体页面依赖、窗体外观、布局、界面等方面进行代码生成。下一节将介绍表格和搜索相关的代码生成配置项。相关项目https://gitee.com/LeeFJ/foxnichttps://gitee.com/LeeFJ/foxni...https://gitee.com/lank/eamhttps://gitee.com/LeeFJ/foxni。..官方文档http://foxnicweb.com/docs/doc…