동적으로 추가 된 FormItem에 오류 텍스트가 표시되지 않습니다.

Question

응용 프로그램의 런타임에 동적으로 양식을 만듭니다. 내 양식 항목의 내용이 (간체)처럼 보인다 (이 MyFormItemContent 불러올 수) :

<?xml version="1.0" encoding="utf-8"?> 
<s:BorderContainer xmlns:fx="http://ns.adobe.com/mxml/2009" 
        xmlns:s="library://ns.adobe.com/flex/spark" 
        width="100%" borderAlpha="0.0"> 
    <fx:Declarations> 
     <utils:DataItemValidator dataItem="{referenceToDataItem}" 
           source="{this}"/> 
    </fx:Declarations> 

    <s:HGroup width="100%"> 
     <s:TextInput width="100%" text="@{bindingToText}"/> 
     <s:CheckBox width="14" selected="{refToBoolean}"/> 
    </s:HGroup> 
</s:BorderContainer> 

우리가 사용하고있는 발리의 코드를. 응용 프로그램의 다른 부분과 디버깅에서 메시지는 있지만 표시되지는 않습니다.

/** 
* This class effectively does *not* validate the given 'value', but just returns 
* his 'dataItem's attached messages. 
*/ 
public class DataItemValidator extends Validator { 

    private var _dataItem:StatefulDataItem; 

    public function get dataItem():StatefulDataItem { 
     return _dataItem; 
    } 

    public function set dataItem(dataItem:StatefulDataItem):void { 
     _dataItem = dataItem; 
     ChangeWatcher.watch(_dataItem, "messages", function():void { 
      validate(); 
     }, false); 

     validate(); 
    } 

    override protected function doValidation(value:Object):Array { 
     if (!isInitialized()) return []; 

     // Clear results Array. 
     var results:Array = []; 
     // If dataItem has error indicator append all messages to result array. 
     if (dataItem && dataItem.messages) { 
      for each (var message:ResultMessage in dataItem.messages) { 
       results.push(new ValidationResult(message.isErroneous(), null, "", message.text)); 
      } 
     } 
     return results; 
    } 

    public function isErroneous():Boolean { 
     if (!dataItem) return false; 
     return dataItem.isErroneous(); 
    } 

    private function isInitialized():Boolean { 
     return (dataItem != null); 
    } 
} 

양식을 선언하는 코드는 다음과 같습니다

<s:Form id="myForm" width="100%" height="100%"> 
    <s:layout> 
     <s:FormLayout gap="-7" paddingBottom="2" paddingLeft="2" paddingRight="2" 
         paddingTop="2"/> 
    </s:layout> 
</s:Form> 

그리고 마지막으로, 항목은 다음과 같이 폼에 추가됩니다

var formItem:FormItem = new FormItem(); 
formItem.label = "some text"; 
formItem.addElement(new MyFormItemContent()); 
myForm.addElement(formItem); 

MyValidator의 유효성 검사가있는 경우 오류로 인해 BorderContainer 주변에 빨간색 프레임이 표시됩니다. 그러나 유감스럽게도 양식 항목에 올바르게 표시되어야하는 오류 텍스트는 그렇지 않습니다. 양식에 내용을 추가하기 전에 양식 항목 내용 내에 유효성 검사기를 정의하기 때문에 레이아웃 문제라고 생각합니다. 나는 이미 이것을 디버깅하고 문서를 많이 읽었습니다.

mxml에서 선언 할 경우 FormItem이 Form에 어떻게 추가되는지 알 수있을 것이라고 생각했지만 그 중 하나에 대한 정보를 찾을 수 없습니다.

Answer 1

<?xml version="1.0" encoding="utf-8"?> 
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
       xmlns:s="library://ns.adobe.com/flex/spark" 
       xmlns:mx="library://ns.adobe.com/flex/mx" creationComplete="application2_creationCompleteHandler(event)" xmlns:local="*"> 

    <fx:Script> 
     <![CDATA[ 
      import mx.charts.series.ColumnSeries; 
      import mx.collections.ArrayCollection; 
      import mx.containers.FormItem; 
      import mx.events.FlexEvent; 



      protected function application2_creationCompleteHandler(event:FlexEvent):void 
      { 
       // TODO Auto-generated method stub 
       for(var i:int = 0; i < 4; i++) 
       { 
        var formItem:FormItem = new FormItem(); 
        formItem.label = "some text"; 
        formItem.addElement(new MyFormItemContent()); 
        myForm.addElement(formItem); 
       } 
      } 

     ]]> 
    </fx:Script> 


    <s:Form id="myForm" width="100%" height="100%"> 
     <s:layout> 
      <s:FormLayout gap="-7" paddingBottom="2" paddingLeft="2" paddingRight="2" 
          paddingTop="2"/> 
     </s:layout> 
    </s:Form> 


</s:Application> 

양식 항목 MXML 파일

<?xml version="1.0" encoding="utf-8"?> 
<s:BorderContainer xmlns:fx="http://ns.adobe.com/mxml/2009" 
        xmlns:s="library://ns.adobe.com/flex/spark" 
        width="100%" borderAlpha="0.0" xmlns:mx="library://ns.adobe.com/flex/mx" creationComplete="bordercontainer1_creationCompleteHandler(event)"> 
    <fx:Script> 
     <![CDATA[ 
      import mx.events.FlexEvent; 
      import mx.events.ValidationResultEvent; 

      [Bindable] 
      private var bindingToText:String; 

      [Bindable] 
      private var refToBoolean:Boolean; 

      protected function bordercontainer1_creationCompleteHandler(event:FlexEvent):void 
      { 
       // TODO Auto-generated method stub 

      } 

      protected function txt_focusOutHandler(event:FocusEvent):void 
      { 
       var obj:ValidationResultEvent = validator.validate(txt.text); 
       error.visible = !(obj.type == "valid"); 
      } 

     ]]> 
    </fx:Script> 
    <fx:Declarations> 
     <mx:PhoneNumberValidator id="validator"/> 
    </fx:Declarations> 

    <s:HGroup width="100%"> 
     <s:TextInput id="txt" width="100%" text="@{bindingToText}" focusOut="txt_focusOutHandler(event)"/> 
     <s:CheckBox width="14" selected="{refToBoolean}"/> 
     <s:Label id="error" visible="false" backgroundColor="red" text="This Field Required"/> 
    </s:HGroup> 
</s:BorderContainer> 

내가 관심이 코드를 게시하고있다.