From land of Aryan's

NET And Flex – This Tutorial Will help you to interact with .net from
flex. if you have any query please free to mail me or chat
ranjit.s…@gmail.com

1.      Create .net webservice(Visual studio 2005)
Goto File>>New>>Websites>>
ASP .NET Webservice >> Use appopriate backend language. In my case I
am using .vb.
Select ok, you will by default get the webmethod “Hello World”

If  you invoke you get the web service running and your development
server running,
In my case it is http://localhost:2290/Website/service.asmx
It Changes depending to your port availability.

This will display the the available list of methods in your
webservice.
        The first line on the executed page is

The following operations are supported. For a formal definition,
please review the Service Description

If you click on Service Description you will get the following link

http://localhost:2290/website/service.asmx?WSDL

this is called WebService Discripter Language.

If you click on webmethod and click Invoke button, you will get the
XML formated  result. And this we will be using this in Webservice
class in flex.

Example :-
<?xml version=”1.0″ encoding=”utf-8″ ?>
  <string xmlns=”http://tempuri.org/“>Hello From .net</string>

2.      Flex Example(Flex Builder 3)
Now that we have created our webservice using flex. We will create
sample application which will access the .Net.

I have created file DotNetFlex.mxml
<?xml version=”1.0″ encoding=”utf-8″?>
<mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml“
layout=”vertical”>
        <mx:WebService id=”DotNetConnection”
        wsdl=”http://localhost:2290/WebSite/Service.asmx?WSDL“>
                <mx:operation name=”HelloWorld” result=”ResultHandler(event)” />
        </mx:WebService>
        <mx:Script>
                <![CDATA[
                        import mx.controls.Alert;
                        import mx.rpc.events.ResultEvent;
                        private function callToNet(event:MouseEvent):void
                        {
                                DotNetConnection.HelloWorld();
                        }
                        private function ResultHandler(event:ResultEvent):void
                        {
                                Alert.show(event.result.toString());
                        }
                ]]>
        </mx:Script>
        <mx:Button x=”382″ y=”28″ label=”Call To .Net”
click=”callToNet(event)” />

</mx:Application>

Webservice tag is used to create .net connection in flex(Primary way)

        <mx:WebService id=”DotNetConnection”
        wsdl=”http://localhost:2290/WebSite/Service.asmx?WSDL“>
<mx:operation name=”HelloWorld” result=”ResultHandler(event)” />
        </mx:WebService>

        The name of operation tag within the Weservice tag is Same as your
webmethod in .net(web service).
If the name of method doesnot exits in web service, flex application
will throw following error on

[RPC Fault faultString="Couldn't find method 'HelloWorl' in service."
faultCode="Client.NoSuchMethod" faultDetail="null"]

So you must give approriate name.

Resulthandler() is private function which  will catch the event back
from the webservice.

        For Database Connection and retrival of data from DotNet:

        We will use following approch.
        We will return a DataTable from .net webmethod in a webservice.
        .net webmethod

           <WebMethod()> _
Public Function getCategoriesSubCategories() As DataTable

We can also pass parameters as we want to in webmethod

If you execute .net webservice webmethod which returns DataTable
Following output is outputed which is in diffgram format  which is
called as ArrayCollection in the world of flex.

<?xml version=”1.0″ encoding=”utf-8″ ?>
- <DataTable xmlns=”http://tempuri.org/“>
- <xs:schema id=”NewDataSet” xmlns=”" xmlns:xs=”http://www.w3.org/2001/
XMLSchema” xmlns:msdata=”urn:schemas-microsoft-com:xml-msdata”>
- <xs:element name=”NewDataSet” msdata:IsDataSet=”true”
msdata:MainDataTable=”CategorySubcategory”
msdata:UseCurrentLocale=”true”>
- <xs:complexType>
- <xs:choice minOccurs=”0″ maxOccurs=”unbounded”>
- <xs:element name=”CategorySubcategory”>
- <xs:complexType>
- <xs:sequence>
  <xs:element name=”Category_name” type=”xs:string” minOccurs=”0″ />
  <xs:element name=”SubCategory_Name” type=”xs:string” minOccurs=”0″ /

  <xs:element name=”Category_Id” type=”xs:decimal” minOccurs=”0″ />
  </xs:sequence>
  </xs:complexType>
  </xs:element>
  </xs:choice>
  </xs:complexType>
  </xs:element>
  </xs:schema>
- <diffgr:diffgram xmlns:msdata=”urn:schemas-microsoft-com:xml-msdata”
xmlns:diffgr=”urn:schemas-microsoft-com:xml-diffgram-v1″>
- <NewDataSet xmlns=”">
- <CategorySubcategory diffgr:id=”CategorySubcategory1″
msdata:rowOrder=”0″>
  <Category_name>MyContent</Category_name>
  <SubCategory_Name>SubGroth</SubCategory_Name>
  <Category_Id>9</Category_Id>
  </CategorySubcategory>
- <CategorySubcategory diffgr:id=”CategorySubcategory2″
msdata:rowOrder=”1″>
  <Category_name>Publish</Category_name>
  <SubCategory_Name>hrmkkjhi</SubCategory_Name>
  <Category_Id>17</Category_Id>
  </CategorySubcategory>
- <CategorySubcategory diffgr:id=”CategorySubcategory3″
msdata:rowOrder=”2″>
  <Category_name>Publish</Category_name>
  <SubCategory_Name>ACCELERATE</SubCategory_Name>
  <Category_Id>17</Category_Id>
  </CategorySubcategory>
………………………………

We will call the “getCategoriesSubCategories” method same as we called
Helloworld.
From flex we can call method same as Helloworld

DotNetFlex.mxml

<?xml version=”1.0″ encoding=”utf-8″?>
<mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml“
layout=”vertical”>
        <mx:WebService id=”DotNetConnection”
        wsdl=”http://localhost:1977/WebSite2/Service.asmx?WSDL“>
                <mx:operation name=”HelloWorld” result=”ResultHandler(event)” />
                <mx:operation name=”getCategoriesSubCategories”
result=”DataHandler(event)” />
        </mx:WebService>
        <mx:Script>
                <![CDATA[
                        import mx.collections.ArrayCollection;
                        import mx.controls.Alert;
                        import mx.rpc.events.ResultEvent;
                        [Bindable]
                        private var DotNetData:ArrayCollection;

                        private function callToNet(event:MouseEvent):void
                        {
                                DotNetConnection.HelloWorld();
                        }
                        private function callData(event:MouseEvent):void
                        {
                                DotNetConnection.getCategoriesSubCategories();
                        }
                        private function ResultHandler(event:ResultEvent):void
                        {
                                Alert.show(event.result.toString());
                        }
                        private function DataHandler(event:ResultEvent):void
                        {
                                DotNetData=event.result.Tables.CategorySubcategory.Rows;
                                //Alert.show(event.result.toString());
                        }
                ]]>
        </mx:Script>
        <mx:Button x=”382″ y=”28″ label=”Call To .Net”
click=”callToNet(event)” />
        <mx:Button x=”382″ y=”28″ label=”Call Data” click=”callData(event)” /

        <mx:DataGrid id=”DG1″ dataProvider=”{DotNetData}” />
</mx:Application>

        Look at the event handler for the method it returns the array
collection

                event.result.Tables.CategorySubcategory.Rows

        “event.result.Tables” is common ObjectProxy which returns a data from
dotNet. “CategorySubcategory” is my DataTable Name from .net (table I
return), .Rows will navigate to complete data in your result.
        To see the result returned, you can put a debug point on the
datahandler function. Looking in variable window in flex debugger
prespective will give you complete detail about your data.
DotNetData is ArrayCollection and is Bindable which helps data to bind
to datagrid when ever it is changed.

Service.vb file

Imports System.Web
Imports System.Web.Services
Imports System.Web.Services.Protocols
Imports System.Data
Imports System.Data.SqlClient
Imports System.Data.OleDb
Imports System.Data.Odbc

<WebService(Namespace:=”http://tempuri.org/“)> _
<WebServiceBinding(ConformsTo:=WsiProfiles.BasicProfile1_1)> _
<Global.Microsoft.VisualBasic.CompilerServices.DesignerGenerated()> _
Public Class Service
     Inherits System.Web.Services.WebService
    Shared SQLConnection As SqlConnection
    Shared alfrescoConnection As OdbcConnection
    <WebMethod()> _
    Public Function HelloWorld() As String
        Return “Hello From .net”
    End Function
    Public Function getConnection() As Boolean
        Try
            Dim strConnection As String
            strConnection = “Data Source=URSERVERNAME;Initial
Catalog=YOURDATABASENAME;Persist Security Info=True;User
ID=sa;Password=sa1234″
            ‘Dim Connection As SqlConnection
            SQLConnection = New SqlConnection(strConnection)
            SQLConnection.Open()
            Return True
        Catch ex As Exception
            Return False
        End Try

    End Function
    <WebMethod()> _
Public Function getCategoriesSubCategories() As DataTable
        getConnection()
        Dim SqlDataSet As DataSet = New DataSet()
        Dim adpt As New SqlDataAdapter
        ‘    Dim strConn As SqlConnection
        Dim str As String
             Try
            str = “select X1.Category_name, x2.SubCategory_Name,
X1.Category_Id  from ” & _
                 ”(select Category_name, Category_Id from
B_Category)X1 Left outer join” & _
                “(select SubCategory_Name, Category_Id from
b_SubCategory)X2 on X1.Category_Id=X2.Category_Id”
            adpt = New SqlDataAdapter(str, SQLConnection)
            adpt.Fill(SqlDataSet, “CategorySubcategory”)
        Catch ex As Exception

        End Try
        Return SqlDataSet.Tables(“CategorySubcategory”)

    End Function
End Class

Regards,
Ranjit Sail