Flex表单自动填充与表单数据自动收集

最新推荐文章于 2024-11-14 09:21:17 发布

weixin_34220623

最新推荐文章于 2024-11-14 09:21:17 发布

阅读量138

点赞数

文章标签：大数据

原文链接：https://my.oschina.net/webas/blog/151116

版权

为什么80%的码农都做不了架构师？>>>

如题，以下代码展示如何讲界面的表单域的值自动归集到指定对象，以及如何用指定对象自动填充表单域，思路很简单，但用起来挺方便的，代码结构不算好，但挺稳定的，所以也懒得去重构了。

简单的说下原理：

1 收集表单数据，通过指定容器对象，对容器进行递归遍历，当发现是表单域时，判断对象是否有表单域名称相同的属性，如果有则将表单域的值设置到对象中。

2 同理重置表单和自动填充表单对1做反向操作就行，只是对下拉、radio等会自动定位判断。

问题：

1 当界面的表单值对应到多个对象时要自动封装怎么办，很简单，调用多次wrapperFormData(container:Object,bo:Object)就行。

2 当界面的表单值对应到多个对象时要自动填充怎么办，同样，调用多次fillForm(rec:Object,container:Object)就行。

支持flex3和flex4版本。

As代码

package xxx.service
{
import mx.controls.CheckBox;
import mx.controls.ComboBox;
import mx.controls.DateField;
import mx.controls.RadioButton;
import mx.controls.RadioButtonGroup;
import mx.controls.TextArea;
import mx.controls.TextInput;
import mx.core.Container;
import mx.core.IVisualElementContainer;
import spark.components.BorderContainer;
import spark.components.CheckBox;
import spark.components.ComboBox;
import spark.components.DropDownList;
import spark.components.RadioButton;
import spark.components.RadioButtonGroup;
import spark.components.TextArea;
import spark.components.TextInput;
/**
* 表单数据收集和填充服务
* 收集过程：通过遍历容器，提取容器种的表单控件，将表单控件的id与值作为对象的属性与值写入对象
* 赋值过程：通过遍历容器，提取容器种的表单控件，如果数据源中包含表单控件的id，则对该控件赋值
*/
public class FormParser
{
private static var _instance:FormParser=new FormParser();
public function FormParser()
{
}
public static function getInstance():FormParser
{
return _instance;
}
public function wrapperFormData(container:Object,bo:Object):void
{
if(bo==null)
{
throw new Error("收集表单数据的对象不能为空!");
}
var count:Number=container.numChildren;
for(var i:Number=0;i<count;i++)
{
var obj:Object=container.getChildAt(i);
if(isTextField(obj))
{
appendProperty(bo,obj,obj.text);
}
else if(isCheckBox(obj))
{
appendProperty(bo,obj,obj.selected?"1":"0");
}
else if(isRadioButton(obj))
{
if(obj.groupName!=null)
{
bo[obj.groupName]=obj.group.selectedValue;
continue;
}
if(obj.selected)
{
appendProperty(bo,obj,obj.value);
}
}
else if(isComboBox(obj))
{
var result:Object=(obj.selectedItem==null||obj.selectedItem is String||!obj.selectedItem.hasOwnProperty("data"))?null:obj.selectedItem.data;
appendProperty(bo,obj,result);
}
else if(isDropDownList(obj))
{
var dr:DropDownList=obj as DropDownList;
appendProperty(bo,obj,dr.selectedItem.data);
}
else if(isRadioButtonGroup(obj))
{
//取不到
}
else if(obj is Container||obj is IVisualElementContainer)
{
wrapperFormData(obj,bo);
}
}
}
/***
* 为对象增加指定属性和属性值
*/
private function appendProperty(bo:Object,obj:Object,propertyValue:Object):void
{
if(!obj.hasOwnProperty("id"))
{
return;
}
bo[obj["id"]]=propertyValue;
}
/***
* 重置form中的项
*/
public function resetForm(container:Object):void
{
var count:Number=container.numChildren;
for(var i:Number=0;i<count;i++)
{
var obj:Object=container.getChildAt(i);
if(isTextField(obj))
{
obj.text="";
}
else if(isCheckBox(obj))
{
obj.selected=false;
}
else if(isRadioButton(obj))
{
if(obj.groupName!=null)
{
obj.group.selectedValue=null;
continue;
}
if(obj.groupName==undefined||obj.groupName=="")
{
obj.selected=false;
}
}
else if(isComboBox(obj))
{
obj.selectedIndex=0;
}
else if(isRadioButtonGroup(obj))
{
obj.selectedValue=obj.getRadioButtonAt(1).value;
}
else if(isDropDownList(obj))
{
obj.selectedIndex=0;
}
else if(obj is Container|| obj is IVisualElementContainer)
{
resetForm(obj);
}
}
}
/***
* 根据对象填充表单
*/
public function fillForm(rec:Object,container:Object):void
{
if(rec==null)
{
throw new Error("指定的数据源为空！");
}
var count:Number=container.numChildren;
for(var i:Number=0;i<count;i++)
{
var obj:Object=container.getChildAt(i);
var name:String=getObjectName(rec,obj);
if(isFormControl(obj))
{
if(name==null)
{
continue;
}
}
var value:String=getValue(rec,name);
if(isTextField(obj))
{
obj.text=value;
}
else if(isCheckBox(obj))
{
if(value=="1")
{
obj.selected=true;
}
}
else if(isRadioButton(obj))
{
if(obj.groupName!=null)
{
obj.group.selectedValue=value;
}
else
{
if(obj.data==value)
{
obj.selected=true;
}
}
}
else if(isComboBox(obj)||isDropDownList(obj))
{
var source:Object=obj.dataProvider;
var sel:Object=getItemByData(source,value);
if(sel==null)
{
obj.selectedIndex=0;
}
else
{
obj.selectedItem=sel;
}
}
else if(obj is Container||obj is IVisualElementContainer)
{
fillForm(rec,obj);
}
}
}
private function getValue(rec:Object,name:String):String
{
return name==null?"":rec[name];
}
private function getObjectName(rec:Object,obj:Object):String
{
var name:String=obj.hasOwnProperty("id")?obj.id:null;
if(isRadioButton(obj)&&obj&&obj.groupName!=null)
{
name=obj.groupName;
}
if(rec.hasOwnProperty(name))
{
return name;
}
return null;
}
private function isFormControl(obj:Object):Boolean
{
if(isTextField(obj))
{
return true;
}
if(isCheckBox(obj)||isRadioButton(obj)||isComboBox(obj))
{
return true;
}
return false;
}
/**
* source Combox下拉列表数据源
* itemData 下拉数据源中某项的data属性值
* return itemData对应的item
*/
public function getItemByData(source:Object,itemData:Object):Object
{
if(source==null||itemData==null)
{
return null;
}
for each(var obj:Object in source)
{
if(obj.data==itemData)
{
return obj;
}
}
return null;
}
private function isDropDownList(obj:Object):Boolean
{
return obj is DropDownList;
}
private function isRadioButtonGroup(obj:Object):Boolean
{
return obj is mx.controls.RadioButtonGroup||obj is spark.components.RadioButtonGroup;
}
private function isRadioButton(obj:Object):Boolean
{
return obj is mx.controls.RadioButton||obj is spark.components.RadioButton;
}
private function isComboBox(obj:Object):Boolean
{
return obj is mx.controls.ComboBox||obj is spark.components.ComboBox;
}
private function isCheckBox(obj:Object):Boolean
{
return obj is mx.controls.CheckBox||obj is spark.components.CheckBox;
}
private function isTextField(obj:Object):Boolean
{
if(obj is mx.controls.TextInput||obj is mx.controls.TextArea||obj is mx.controls.DateField||obj is spark.components.TextInput||obj is spark.components.TextArea)
{
return true;
}
return false;
}
}
}