Flex Parent-child windows Invoke implementation ideas and source code _flex

1, design ideas

(1) Method of child window calling parent window

(2) After the child window has made the modification, returns the parent window, the parent window calls the child window function


2. Design Source

(1) Parent window

Parentwindow.mxml:

Copy Code code as follows:

<?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"
Width= "100%" height= "100%" >
<s:layout>
<s:BasicLayout/>
</s:layout>
<fx:Declarations>
<!--place non-visual elements (such as services, value objects) here-->
</fx:Declarations>

<fx:Script>
<! [cdata[
Import mx.collections.ArrayCollection;
Import Mx.controls.Alert;
Import Mx.managers.PopUpManager;

[bindable]
Table Data Source Bindings
private var grid:arraycollection = new ArrayCollection ([
{number: "2014010101", Name: "Zhang San", Sex: "Male", Age: "23"},
{number: "2014010102", Name: "Li si", Sex: "Female", Age: "22"},
{number: "2014010101", Name: "Prince", Sex: "Male", Age: "21"},
{number: "2014010101", Name: "Zhao Liu", Sex: "Female", Age: "20"},
{number: "2014010101", Name: "Tour China", Sex: "Male", Age: "22"},
{number: "2014010101", Name: "Soath", Sex: "Female", Age: "18"},
{number: "2014010101", Name: "Zhou Li", Sex: "Male", Age: "19"},
{number: "2014010101", Name: "Hua Jie", Sex: "Female", Age: "20"},
{number: "2014010101", Name: "Liuliang", Sex: "Male", Age: "22"},
{number: "2014010101", Name: "Shen She", Sex: "Female", Age: "21"}
]);

/* Modify Event Function/*
protected function Updatehandler (event:mouseevent): void
{
New Child Form Object
var Childwindow:childwindow = new ChildWindow ();
Add a subform to the Popupmanager
Popupmanager.addpopup (childwindow,this,true);
Passing parameters to a subform
Childwindow.age = "23";
child window Call Parent window function
Childwindow.callback = this.myfunction;
Sub-form Center Popup
Popupmanager.centerpopup (ChildWindow);
}

/* Refresh Function * *
Public Function MyFunction (you:string): void
{
Alert.show (you+ "Hello");
}

]]>
</fx:Script>
<mx:vbox width= "100%" height= "100%" paddingbottom= "ten" paddingleft= "ten" paddingright= "ten" paddingtop= "ten" >
<mx:datagrid id= "DataGrid" dataprovider= "{grid}" rowcount= "{grid.length + 1}" width= "100%"
Verticalalign= "Middle" textalign= "center" >
<mx:columns>
<mx:datagridcolumn headertext= "School No." datafield= "number"/>
<mx:datagridcolumn headertext= "name" datafield= "name"/>
<mx:datagridcolumn headertext= "gender" datafield= "sex"/>
<mx:datagridcolumn headertext= "Age" datafield= "ages"/>
</mx:columns>
</mx:DataGrid>
<mx:hbox width= "100%" horizontalalign= "center" verticalalign= "Middle" >
<s:button label= "Modify" click= "Updatehandler (event)"/>
</mx:HBox>
</mx:VBox>
</s:Application>

(2) Child window

Childwindow.mxml:

Copy Code code as follows:

<?xml version= "1.0" encoding= "Utf-8"?>
<s:titlewindow xmlns:fx= "http://ns.adobe.com/mxml/2009"
Xmlns:s= "Library://ns.adobe.com/flex/spark"
xmlns:mx= "Library://ns.adobe.com/flex/mx" width= "220" height= "
Close= "Closehandler (event)" title= "Modify Window" >
<s:layout>
<s:BasicLayout/>
</s:layout>
<fx:Script>
<! [cdata[
Import mx.events.CloseEvent;
Import Mx.managers.PopUpManager;

callback function
public Var callback:function;

public var age:string = "";

/* Shutdown Event Function/*
protected function Closehandler (event:closeevent): void
{
Popupmanager.removepopup (this);
}

/* Modify button Event function * *
protected function Updatehandler (event:mouseevent): void
{
Stuage.text = age;
}

/* Cancel button event Function/*
protected function Cancelhandler (event:mouseevent): void
{
Number.text = "";
Stuname.text = "";
Popupmanager.removepopup (this);
if (Ispopup)
{
Callback.call (parent);
}
}
]]>
</fx:Script>
<fx:Declarations>
<!--place non-visual elements (such as services, value objects) here-->
</fx:Declarations>

<mx:vbox width= "100%" height= "100%" >
<mx:Form>
<mx:formitem label= "School No.:" >
<s:textinput id= "number" width= "a" maxchars= "ten"/>
</mx:FormItem>
<mx:formitem label= "Name:" >
<s:textinput id= "Stuname" width= "maxchars="/>
</mx:FormItem>
<mx:formitem label= "Sex:" >
<mx:hbox width= "100%" >
<mx:radiobuttongroup id= "Sex"/>
<s:radiobutton groupname= "Sex" label= "male" selected= "true"/>
<s:radiobutton groupname= "Sex" label= "female"/>
</mx:HBox>
</mx:FormItem>
<mx:formitem label= "Age:" >
<s:textinput id= "Stuage" width= "maxchars=" "2"/>
</mx:FormItem>
<mx:FormItem>
<mx:hbox width= "100%" >
<s:button label= "Modify" click= "Updatehandler (event)"/>
<s:label width= "/>"
<s:button label= "Cancel" click= "Cancelhandler (event)"/>
</mx:HBox>
</mx:FormItem>
</mx:Form>
</mx:VBox>
</s:TitleWindow>

3. Design result

(1) When initializing

(2) Click the Modify button