Go to my github

开发日志:表单解析 LeipiFormDesign

PHP版本:https://gitee.com/yxkj_2/LeipiFormDesigner/blob/LeipiFormDesigner/Formdesign4_1/php/Formdesign.class.php

js版本: 

   var leipiFormDesign = {
        /*执行控件*/
        exec: function (method) {
            ue.execCommand(method);
        },
        /*
            Javascript 解析表单
            template 表单设计器里的Html内容
            fields 字段总数
        */
        parse_form: function (template, fields) {
            //正则  radios|checkboxs|select 匹配的边界 |--|  因为当使用 {} 时js报错
            var preg = /(\|-<span[^>]*leipiplugins=\"(radios|checkboxs|select)\".*?)>(.*?)<\/span>-\||<(img|input|textarea|select).*?(<\/select>|<\/textarea>|\/>))/gi, preg_attr = /(\w+)=\"(.?|.+?)\"/gi, preg_group = /<input.*?\/>/gi;
            if (!fields) fields = 0;
            var template_parse = template, template_data = new Array(), add_fields = new Object(), checkboxs = 0;
            var pno = 0;
            template.replace(preg, function (plugin, p1, p2, p3, p4, p5, p6) {
                var parse_attr = new Array(), attr_arr_all = new Object(), name = '', select_dot = '', is_new = false;
                var p0 = plugin;
                var tag = p6 ? p6 : p4;if (tag == 'radios' || tag == 'checkboxs') {
                    plugin = p2;
                } else if (tag == 'select') {
                    plugin = plugin.replace('|-', '');
                    plugin = plugin.replace('-|', '');
                }
                plugin.replace(preg_attr, function (str0, attr, val) {
                    if (attr == 'name') {
                        return;
                    }
                    if (attr == 'title') {  //如果是title,强制转成name
                        if (!attr_arr_all['name']) attr_arr_all['name'] = val;
                        parse_attr.push({ name: val });
                        name = val;
                    }

                    if (tag == 'select' && attr == 'value') {
                        if (!attr_arr_all[attr]) attr_arr_all[attr] = '';
                        attr_arr_all[attr] += select_dot + val;
                        select_dot = ',';
                    } else {
                        attr_arr_all[attr] = val;
                    }
                    var oField = new Object();
                    oField[attr] = val;
                    parse_attr.push(oField);
                })
                /*alert(JSON.stringify(parse_attr));return;*/
                if (tag == 'checkboxs') /*复选组  多个字段 */ {
                    plugin = p0;
                    plugin = plugin.replace('|-', '');
                    plugin = plugin.replace('-|', '');
                    var name = 'checkboxs_' + checkboxs;
                    attr_arr_all['parse_name'] = name;
                    attr_arr_all['name'] = '';
                    attr_arr_all['value'] = '';

                    attr_arr_all['content'] = '<span leipiplugins="checkboxs"  title="' + attr_arr_all['title'] + '">';
                    var dot_name = '', dot_value = '';
                    p5.replace(preg_group, function (parse_group) {
                        var is_new = false, option = new Object();
                        parse_group.replace(preg_attr, function (str0, k, val) {
                            if (k == 'name') {
                                if (val == 'leipiNewField') {
                                    is_new = true;
                                    fields++;
                                    val = 'data_' + fields;
                                }

                                attr_arr_all['name'] += dot_name + val;
                                dot_name = ',';

                            }
                            else if (k == 'value') {
                                attr_arr_all['value'] += dot_value + val;
                                dot_value = ',';

                            }
                            option[k] = val;
                        });

                        if (!attr_arr_all['options']) attr_arr_all['options'] = new Array();
                        attr_arr_all['options'].push(option);
                        //if(!option['checked']) option['checked'] = '';
                        var checked = option['checked'] != undefined ? 'checked="checked"' : '';
                        attr_arr_all['content'] += '<input type="checkbox" name="' + option['name'] + '" value="' + option['value'] + '"  ' + checked + '/>' + option['value'] + '&nbsp;';

                        if (is_new) {
                            var arr = new Object();
                            arr['name'] = option['name'];
                            arr['leipiplugins'] = attr_arr_all['leipiplugins'];
                            add_fields[option['name']] = arr;

                        }

                    });
                    attr_arr_all['content'] += '</span>';

                    //parse
                    template = template.replace(plugin, attr_arr_all['content']);
                    template_parse = template_parse.replace(plugin, '{' + name + '}');
                    template_parse = template_parse.replace('{|-', '');
                    template_parse = template_parse.replace('-|}', '');
                    template_data[pno] = attr_arr_all;
                    checkboxs++;

                } else if (name) {
                    if (tag == 'radios') /*单选组  一个字段*/ {
                        plugin = p0;
                        plugin = plugin.replace('|-', '');
                        plugin = plugin.replace('-|', '');
                        attr_arr_all['value'] = '';
                        attr_arr_all['content'] = '<span leipiplugins="radios" name="' + attr_arr_all['name'] + '" title="' + attr_arr_all['title'] + '">';
                        var dot = '';
                        p5.replace(preg_group, function (parse_group) {
                            var option = new Object();
                            parse_group.replace(preg_attr, function (str0, k, val) {
                                if (k == 'value') {
                                    attr_arr_all['value'] += dot + val;
                                    dot = ',';
                                }
                                option[k] = val;
                            });
                            option['name'] = attr_arr_all['name'];
                            if (!attr_arr_all['options']) attr_arr_all['options'] = new Array();
                            attr_arr_all['options'].push(option);
                            //if(!option['checked']) option['checked'] = '';
                            var checked = option['checked'] != undefined ? 'checked="checked"' : '';
                            attr_arr_all['content'] += '<input type="radio" name="' + attr_arr_all['name'] + '" value="' + option['value'] + '"  ' + checked + '/>' + option['value'] + '&nbsp;';

                        });
                        attr_arr_all['content'] += '</span>';

                    } else {
                        attr_arr_all['content'] = is_new ? plugin.replace(/leipiNewField/, name) : plugin;
                    }
                    //attr_arr_all['itemid'] = fields;
                    //attr_arr_all['tag'] = tag;
                    template = template.replace(plugin, attr_arr_all['content']);
                    template_parse = template_parse.replace(plugin, '{' + name + '}');
                    template_parse = template_parse.replace('{|-', '');
                    template_parse = template_parse.replace('-|}', '');
                    if (is_new) {
                        var arr = new Object();
                        arr['name'] = name;
                        arr['leipiplugins'] = attr_arr_all['leipiplugins'];
                        add_fields[arr['name']] = arr;
                    }
                    template_data[pno] = attr_arr_all;


                }
                pno++;
            })
            var parse_form = new Object({
                'Fields': fields,//总字段数
                'Content': template,//完整html
                'ContentParse': template_parse,//控件替换为{data_1}的html
                'ContentData': JSON.stringify(template_data),//控件属性
                'add_fields': add_fields//新增控件
            });
            return parse_form;
        },
        /*type  =  save 保存设计 versions 保存版本  close关闭 */
        fnCheckForm: function (type) {
            if (ue.queryCommandState('source'))
                ue.execCommand('source');//切换到编辑模式才提交,否则有bug

            if (ue.hasContents()) {
                ue.sync();/*同步内容*/

                return false;

            } else {
                layer.msg('表单内容不能为空!');
                $('#submitbtn').button('reset');
                return false;
            }
        },
        /*预览表单*/
        fnReview: function () {
            if (ue.queryCommandState('source'))
                ue.execCommand('source');/*切换到编辑模式才提交,否则部分浏览器有bug*/
            if (ue.hasContents()) {
                ue.sync();       /*同步内容*/
                //--------------以下仅参考-------------------------------------------------------------------  
                /*设计form的target 然后提交至一个新的窗口进行预览*/
                var fields = $("#Fields").val(), formeditor = '';

                //获取表单设计器里的内容  
                formeditor = ue.getContent();
                //解析表单设计器控件  
                var parse_form = this.parse_form(formeditor, fields);

                var forms1 = parse_form.Content;
                win_parse = window.open('', '', 'width=800,height=400,alwaysRaised=yes,top=100,left=200');
                var str = '<div style="width:500px;height:300px;border:1px solid grey">' + forms1 + '</div>';
                win_parse.document.write(forms1);
                win_parse.focus();
            } else {
                alert('表单内容不能为空!');
                return false;
            }
        }
    };

 

C#版本: 

using System;
using System.Text.RegularExpressions;
using System.Collections.Generic;
using System.Collections;
using System.Data;
namespace System {
    public class LeipiFormDesign {
        //https://gitee.com/yxkj_2/LeipiFormDesigner/blob/LeipiFormDesigner/Formdesign4_1/php/Formdesign.class.php
        public static Dictionary<string, object> parse_form(string template) {
            bool is_new = false;
            /*  获取标签
                //正则  radios|checkboxs|select 
                js 匹配的边界 |--|  因为当使用 {} 时js报错
                php 要保持一致,也使用 |--| 也可以是直接 {|- -|}
            */
            string preg = @"(\|-<span[^>]*leipiplugins[^>]*>(.*?)<\/span>-\||<(img|input|textarea|select).*?(<\/select>|<\/textarea>|\/>))";
            //获取属性  修改为可变 的匹配
            string preg_attr = "(\\w+)=\"(.?|.+?)\"";
            //获取单选组复选
            string preg_group = "<input[^>]*/>";

            string template_parse = template;
            var ret_form = new Dictionary<string, object>();
            var template_data = new Dictionary<string, object>();
            var add_fields = new Dictionary<string, object>();

            var regex = new Regex(preg, RegexOptions.IgnoreCase | RegexOptions.Multiline | RegexOptions.CultureInvariant);
            var match = regex.Matches(template_parse);
            if (match.Count > 0) {
                for (int i = 0; i < match.Count; i++) {
                    Match m = match[i];
                    string plugin = m.ToString().Replace("|-", "").Replace("-|", "");
                    string tag = string.IsNullOrWhiteSpace(m.Groups[3].Value) ? m.Groups[4].Value : m.Groups[3].Value;
                    string name = "", leipiplugins = "", select_dot = "";
                    is_new = false;
                    //radios|checkboxs|select
                    if (plugin.Contains("radios")) {
                        tag = "radios";
                    } else if (plugin.Contains("checkboxs")) {
                        tag = "checkboxs";
                    } else if (plugin.Contains("select")) {
                        tag = "select";
                    } else if (plugin.Contains("img")) {
                        tag = "img";
                    } else if (plugin.Contains("textarea")) {
                        tag = "textarea";
                    }
                    //获取属性
                    var attr_arr_all = new Dictionary<string, object>();
                    var parse_attr = Regex.Matches(plugin, preg_attr);
                    foreach (Match pa in parse_attr) {
                        string attr = pa.ToString();
                        if (!string.IsNullOrWhiteSpace(attr)) {
                            var key = pa.Groups[1].Value.Trim();
                            var val = pa.Groups[2].Value.Trim();
                            if (key == "id") {
                                name = val;
                            } else if (key == "name" && (tag == "radios" || tag == "checkboxs")) {
                                name = val;
                                attr_arr_all.AddOrTry("id", val);
                            }
                            if (key == "value" && (tag == "radios" || tag == "checkboxs")) {
                                select_dot += val + ",";
                            } else {
                                attr_arr_all.AddOrTry(key, val);
                            }
                        }
                    }
                    if (!string.IsNullOrWhiteSpace(select_dot)) {
                        attr_arr_all.AddOrTry("value", select_dot);
                        select_dot = "";
                    }
                    if (tag == "checkboxs") {
                        attr_arr_all.AddOrTry("content", plugin);
                    } else if (!string.IsNullOrWhiteSpace(name)) {
                        if (tag == "radios") {
                            attr_arr_all.AddOrTry("content", plugin);
                        } else {
                            if (is_new) {
                                attr_arr_all.AddOrTry("content", plugin.Replace("leipiNewField", name));
                            } else {
                                attr_arr_all.AddOrTry("content", plugin);
                            }
                        }
                        template = template.Replace(plugin, attr_arr_all["content"].ToString());
                        template_parse = template_parse.Replace(plugin, "{" + name + "}");
                        template_parse = template_parse.Replace("{|-", "").Replace("-|}", "");//清空边界
                        if (is_new) {
                            add_fields.AddOrTry(name, attr_arr_all["leipiplugins"]);
                        }
                        template_data.AddOrTry(name, attr_arr_all);
                    }
                }
            }

            ret_form.Add("fields", template_data.Count);
            ret_form.Add("template", template);//完整html
            ret_form.Add("parse", template_parse);//控件替换为{data_1}的html
            ret_form.Add("data", template_data.ToJson());//控件属性
            ret_form.Add("add_fields", add_fields);//新增控件
            return ret_form;
        }
    }
}

 

posted @ 2024-08-25 15:25  峡谷少爷  阅读(20)  评论(0编辑  收藏  举报