Custom field handling

1. Preface
   Custom fields are also called "open model". Users can add required fields according to their own needs to achieve personalized customization.
2. The purpose of using custom fields, and what problems can be solved by using custom fields. For
   example, in an existing CRM system, customer information in the customer module needs to be customized for different industries and different formats. Then we know that the customer information table T_CUSTOM, such as name, gender, telephone
   and other basic general attributes can be used, but for example, customers in the pharmaceutical industry need to record weight, blood pressure, etc., while customers in the transportation industry pay more attention to the category of goods, output, etc. Another example is that the fast-moving consumer goods industry pays attention to customers' hobbies, age, and constellation. How to deal with these problems?

3. Design and implementation of custom fields
   a. Description of related database tables
   Custom template table: T_CUSTOM_FIELD_TEMPLATE
   customer information table: T_CUSTOM
   format industry type and custom template application table: T_BUSINISS_TEMPLATE
   Note: T_BUSINISS_TEMPLATE different formats and industry types correspond to different customizations template

   b、相关数据库表结构说明
   

   • 1

   Custom template table: T_CUSTOM_FIELD_TEMPLATE
   

Note: The content of the template is as follows

[{"label":"货品名称","fieldName":"productName","type":"textfield","required":true,"sequence":1,"rows":3,"minLength":5,"maxLength":20,"vtype":"none","vtypeContent":"","vtypeText":"","defaultValue":"apple Mac","readOnly":false},{"label":"产量","fieldName":"turnout","type":"numberfield","required":true,"sequence":2,"minValue":5,"maxValue":20,"decimalPrecision":2,"defaultValue":20000,"readOnly":false},{"label":"爱好","fieldName":"loves","type":"combobox","required":false,"sequence":4,"singleOption":[{"itemValue":"1","itemName":"看书"},{"itemValue":"2","itemName":"羽毛球"}],"defaultValue":"1"}]

• 1

Expansion template for the transportation industry


The types of custom fields include text box, number box, date box, single selection box, and multiple selection box.
New custom fields for text box types.

New custom fields for number box types.

New date box types. The custom field of the

new radio

button type custom field is added. For the interface of adding the custom field of the radio button type, please refer to the radio button interface.

Seeing this, comrades who have a certain foundation will definitely feel suddenly enlightened.
The data in the database table are as follows:

new user interface for the medical industry, new user interface for the

fast-moving industry, new user interface for the

transportation industry

, after clicking the new customer button, different custom templates will be automatically loaded according to the current different formats and displayed on the interface Different business custom fields.
d. Analysis and processing involving relevant knowledge points
• Newly added different custom fields are saved in the custom template

//获取post请求的所有参数以及参数对应的值
   Map<String, String[]> params = request.getParameterMap();  
            JSONObject jsonObject = new JSONObject();
            for (String key : params.keySet()) {  
                String[] values = params.get(key);  
                for (int i = 0; i < values.length; i++) {  
                    String value = values[i];  
                    jsonObject.put(key, value);
                }  
            } 
            String content = jsonObject.toString();

Using the above code, adding different custom fields can be processed in the background in a unified manner, and then the JSON of the custom fields can be assembled.
• When a user is added, the template content is obtained in the background, and how the extended fields are displayed on the new page in the foreground.

The background code is as follows:

String content = customFieldTemplate.getContent();
request.setAttribute("content", content);

The custom template is dynamically loaded on the page, the page code is as follows:

<div id="customFieldDiv" class="easyui-panel" title="自定义字段"
                  style="width:96%;height:200px;padding:5px;">
            </div>

var dataStr = '${content}';

        var jsondatas=eval("("+dataStr+")"); 
        var resultHtml = "";
        $.each(jsondatas,function(i,n){  
            if(n.sequence == (i + 1)){
                resultHtml = resultHtml + '<table class="table" style="width: 100%;">';
                if(n.type == 'textfield'){
                    resultHtml = resultHtml + '<tr><td><input labelAlign="right" labelWidth="100px;" label="'+n.label+'" style="width:300px;" type="text" name="'+n.fieldName+'" value="'+n.defaultValue+'" class="easyui-textbox" data-options="required:'+n.required+'"/></td></tr>';
                }else if(n.type == 'numberfield'){
                    resultHtml = resultHtml + '<tr><td><input labelAlign="right" labelWidth="100px;" label="'+n.label+'" style="width:300px;" type="text" name="'+n.fieldName+'" value="'+n.defaultValue+'" class="easyui-numberbox" data-options="required:'+n.required+',min:'+n.minValue+',precision:'+n.decimalPrecision+'"/></td></tr>';
                }else if(n.type == 'datetime'){
                    resultHtml = resultHtml + '<tr><td><input labelAlign="right" labelWidth="100px;" label="'+n.label+'" style="width:300px;" type="text" name="'+n.fieldName+'" value="'+n.defaultValue+'" class="easyui-datebox" data-options="required:'+n.required+',min:'+n.minValue+'"/></td></tr>';
                }else if(n.type == 'combobox'){
                    resultHtml = resultHtml + '<tr><td><select labelAlign="right" labelWidth="100px;" label="'+n.label+'" style="width:300px;"  name="'+n.fieldName+'" class="easyui-combobox" data-options="required:'+n.required+'">';
                    $.each(n.singleOption,function(j,m){ 
                        resultHtml = resultHtml + '<option value="'+m.itemValue+'">'+m.itemName+'</option>';
                    });
                    resultHtml = resultHtml + '</select>';
                    resultHtml = resultHtml + '</td></tr>';
                }

                resultHtml = resultHtml + '</table>';
            }
        }); 
        $('#customFieldDiv').append(resultHtml);

1. Summary
   Another solution for custom fields, EAV (Entity-Attribute-Value), can be Baidu.
   The content of the custom template and the template data of the exhibition field in the customer table are all longtext types. mysql5.7 supports json. You can change these two fields to json type. In addition, please refer to http://blog.csdn.net/qian_meng/article/details/48394379 for the solution of json field in hibernate mapping database . The system can be further optimized through the above two points.
   The type of custom field, in addition to text box, number box, date box, single selection box, multiple selection box, you can also add pictures, sounds, videos and other types.
   When there are a lot of custom fields and their types are different, how to lay out the page makes it more beautiful and comfortable to use.