主页 > 代码素材 > 表单素材 > jQuery可视化表单拖拽插入编辑实例源码
jQuery可视化表单拖拽插入编辑实例源码

jQuery可视化表单拖拽插入编辑实例源码

精品   下载权限: 普通VIP   发布时间:2021-08-21        

30金币 VIP免费下载
  • 源码介绍

基于jQuery和bootstrap框架制作可视化表单,点击工具栏插入文本框、多行文本、框时间选择、框单选框、多选框、下拉选择框、文本下拉框表单元素,支持拖拽或删除,可编辑表单属性内容,导入或导出json数据,表单预览等功能。

59565edfa90b5c1d7a15f787c50034f2.jpg

新增

所有控件定义在数组中,自由增减,属性和样式均定义为方法,自由改变
单选框,多选框,下拉框等增加默认选中
属性窗口增加主动关闭
所有元素增加控件ID,并展示在设计窗口
增加清空所有元素
增加导出JSON格式数据
增加导入JSON格式数据
实现表单预览,以json格式渲染表单的方式
获取表单数据
表单属性可以设置标签对齐方式(居左,居右,局上),标签宽度

修复

拖动元素后,如果未正确拖动到设计区域,隐藏提示线 删除控件后属性框不会消失
不可以鼠标拖动选择输入的内容和标签文字

优化

所有元素设定不同自定义图标,更加美观直观
设计界面增加提示线,方便看到元素占用
美化操作按钮样式,功能不变,占用空间更小,方便扩展
调整部分文本提示
校验错误默认隐藏不占据空间,有错误时展示,无错误时隐藏
调整为左中右固定布局,两侧250px,中间拉满 拖动新元素或删除旧元素时隐藏属性窗口
完善校验规则判断,无校验要求的视为校验通过
移除弹窗js,改用bootstrap自带的模态框 优化校验规则,校验通过返回表单数据 radio类型的属性如果数量大于2则每行只展示一个 属性过多滚动条显示由于白衣苍狗的jQuery拖拽表单(原创)停滞更新,在他的基础上完善迭代


共有 条评论

    相关代码素材

    CSS3单选按钮点击选中动画

    2020-05-21   浏览:640

    jQuery图片上传拖拽排序代

    2019-09-26   浏览:636

    jquery创建表格可视化工具

    2019-05-27   浏览:602

    非常实用的手机端意见反

    2021-04-23   浏览:582

    jQuery下拉菜单选择框ui特效

    2021-09-12   浏览:571

    jQuery带步骤的创建账户表

    2019-06-20   浏览:561

    jQuery表格展开收缩列单元

    2019-05-20   浏览:560

    jQuery可视化表单拖拽插入

    2021-08-21   浏览:557

    嘿,我来帮您!